本文实例讲述了jQuery实现滚动鼠标放大缩小图片的方法。分享给大家供大家参考，具体如下： 在项目制作过程中，遇到了这么一个需求，就开发了一个，记录一下。 首先，需要定义html元素和css样式：滚动鼠标中键，可以放大或者缩小图片在这个样式中，我设置了图片的样式为670px，目的就是避免图片过大的时候，显示到了页面外部的现象。 然后我使用了一个jquery mousewheel 的插件来解决鼠标中键的滚动问题，下面是具体的jquery操作代码...
这是一款基于jQuery的百叶窗焦点图动画，和之前介绍的CSS3百叶窗焦点图动画不同的是，它的兼容性更好，实用性更强，因为它是基于纯jQuery的，基本上所有浏览器都能够支持。焦点图的图片切换动画是百叶窗的动画方式，但也有几种不同的百叶窗动画，因此也不会觉得单调。在线演示 源码下载 HTML代码CSS代码#slider { position: relative; width: 600px; overflow: hidden; margin: 10px auto 30px auto; } #slider li { position:...
为了提高用户体验度，在一些电商网站和家居网站上我们会看到，一张图片中显示多种商品，点击每个商品可以弹出对应商品的简单介绍，包括价格等等，设计非常的人性化，今天我们通过实例给大家分享使用jQuery插件来实现这一效果。 先给大家展示下效果图：效果演示 源码下载HTML 首先，我们加载jQuery库和easypin插件。接着，我们准备一张图片，这是一张展示多个模特服装鞋子包包内的电商图片，注意我们给图片一个easypin-id属...
Selectator是一款实现多选和搜索过滤功能的jQuery下拉列表框插件。它支持搜索，并且能直接影响原始的选择框，而原始的选择框是用作数据容器。通过该下拉列表框插件可以多选项进行分组，设置选项的图标，对选项进行搜索过滤，以及进行多选选择。效果展示 源码下载 使用方法 使用该下拉类别框插件需要在页面中引入fm.selectator.jquery.css、jQuery和fm.selectator.jquery.js文件。HTML结构 一个选项带图标级带分组选项的下拉列...
CSS3和jquery都可以实现缓动追逐效果，但是考虑到浏览器的兼容性，建议使用jquery animate方法来实现。 先给大家展示下实现效果如下：效果演示 源码下载 引用文件： jquery-1.11.1.min.js htmljqueryvar $first=$('#first'); var $second=$('#second'); (function(){ move1(); move2(); })() function move1(){ $first.animate({ "left":220, "top": 0 },400).animate({ "left":220, "top":220 },400).animate({ "left":0, ...
我们经常会应用到日期和时间选择器，之前我们使用最多的是jQuery UI的datepicker()，那么今天我给大家介绍一款非常有趣的日期和时间选择器，它分为日期选择器datedropper以及时间选择器timedropper，他们俩尤其适合在移动端上应用。 在线演示 源码下载 日期选择器datedropper 使用非常简单，分三步，１、引入相关js和css文件。注意datedropper和timedropper都是基于jQuery的插件，所以也要引入jQuery库文件。２、布置body中的...
演示代码: 代码如下: $("#btn").click(function () { alert("click"); $("#msg").load("hello.txt"); }) JavaScript教程/参考手册 JavaScript热搜 Vue利用canvas实现移动端手写板的方法vue2.0 移动端实现下拉刷新和上拉加载更多的示例解决vue-router中的query动态传参问题解决使用vue.js路由后失效的问题微信小程序实现换肤功能JS中touchstart事件与click事件冲突的解决方法完美解决axios在ie下的兼...
思维是个很诡异的东西,一旦陷入某个死角,很难逃出. 惟有冷却一些时间,完全抛开旧的思维,才能找到新的出路. 其实就是一个幻灯效果,考虑到使用方便,就封装成一个插件了. 插件特点 1. 参数高度自定义; 2. 可重复调用且与不影响; 3. 插件文件小,压缩后仅1.04k,开发版3.29k. 演示及下载 点此查看DEMO 点此下载插件 使用方法 1. 引入jQuery库文件及jQuery.iFadeSlide.pack.js插件文件(若页面有其他js文件,可与之合并以减小http请求),引入...
效果图: HTML: 代码如下: aaaaaa bbbbbb ccccc ddddd AAAAAA BBBBBBBB CCCCCC DDDDDD JS: 代码如下: $(function(){ $(#chklist).hcheckbox(); $(#radiolist).hradio(); $(#btnOK).click(function(){ var checkedValues = new Array(); $(#chklist :checkbox).each(function(){ if($(this).is(:checked)) { checkedValues.push($(this).val()); } }); alert(checkedValues.join(,)); alert($(#radiolist :checked).val()); }...
英文链接：http://desizntech.info/2011/01/10-must-see-new-useful-jquery-plugins/ 1.Shadow Animation背景动画，支持淡入淡出效果，可惜ie不支持，火狐和谷歌浏览器能正常运行。 2.jQuery Quick TipjQuery快速提示插件。3.uGallery – Tiny and Clean Image Gallery 用户浏览图片的插件。 4.ezColumns 动态列插件 5.slideMosaic 有点像七巧板的感觉的插件 6.Modalpop 弹出窗提示插件 7.jQuery File Upload jQuery文件上传插件...
待改进部分 1.大图可根据浏览器分辨率自动缩放，目前是按照固定的宽和高显示，超出部分隐藏。 2.大图现在是直接载入了所有，若图片很多时，体验不好。可改为异步加载，或者延迟加载，这个可以用jquery控件lazyload实现。 3.缩略图是根据上传时设定的参数直接生成的，如果是竖形图片，会出现被压缩的情况。可以改为只显示局部，超出部分隐藏。 4.缩略图列表的滑动采用了jcarousellite插件，如果将幻灯片提取为插件的话，需要整合为一...
从网上下载来的版本多多少少都有些BUG，尤其是加载后在IE6和IE7下图片闪动是个大问题，在网上查了很久，也没有找到相关的解决方案。没解决方案，就得发挥咱DIY的精神，自己想法解决，分析了BUG，理了理思路，结合前段时间我做弹出窗口特效的方法，解决了Jquery.LazyLoad.js的兼容问题，现将思路和方法与大家分享一下。 解决思路大致是两点，一是从LazyLoad本身的滤镜参数下手，发现有一个参数在IE6和IE7是可以用的，就是show，那么...
可以从这里下载jQuery 1.6： http://code.jquery.com/jquery-1.6.js http://code.jquery.com/jquery-1.6.min.js Microsoft CDN 下载: http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.min.js jQuery的官方博文中也鼓励社区会员参与到jQuery的核心工作中。此外，jQuery官方透露，已准备着手jQuery 1.7的开发工作，如果你有相关建议，可以向他们提交表单。脚本之家提供的历史版本打包下载。jquery 最新版框架下载(1.32-1.6)
分别是： 1、基本使用方法，通过样式设置验证规则 代码如下: $(function() { $("#signupForm").validate(); }); //验证所选择的表单 Email 年龄 当表单提交时，如果没有填写email或者是错误的email将发生错误,如下所示: 文本框后面的默认提示可以修改jquery.validate.min.js，将英文查找并替换成中文，样式可以通过css的类样式改变如.required,.email等， 当然这里的class可以一项或多项中间用空格分隔，语法格式与c...
Cloud Carousel (演示 | 下载)ShineTime (演示 | 下载)Nivo Slider (演示 | 下载)Interactive Photo Desk (演示 | 下载)Beautiful Photo Stack Gallery with jQuery and CSS3 (演示 | 下载)Micro Image Gallery: A jQuery Plugin (演示 | 下载)Minimalistic Slideshow Gallery with jQuery (演示 | 下载)Image Slider with Unique Effects (演示 | 下载)Create image gallery in 4 lines of jQuery (演示 | 下载)Slideshow with st...