Jquery插件—ycle Plugin插件实现图片循环播放等.docVIP

Jquery插件—Cycle Plugin插件实现图片循环播放等 图片展示效果的jQuery插件很多，都非常实用，jQuery Cycle Plugin。 jQuery Cycle Plugin循环插件，不仅支持图片循环，而且支持任意元素的循环功能，效果非常丰富，可支持鼠标悬停暂停，自动停止，开始和结束事件调用等等，目前你所 看到的图片效果大部分都支持。 需要自定义CSS样式，如： height:??200px; width:??200px; overflow:hidden; #ads .ads li, #ads .ads li img width:960px; height:387px; 使用实例 一，包含文件部分 script type text/javascript src jquery.js script type text/javascript src jquery.cycle.js 二，HTML部分 div id ads ul class ads a href #dinggou img src images/ts_0.jpg alt / a href #dinggou img src images/ts_02.jpg alt / a href #dinggou img src images/ts_03.jpg alt / 三，Javascript部分 $ function $ #ads .ads .cyclefx : fade, timeout : 4000, pager : .num, pagerEvent : mouseover, pauseOnPagerHover : true, activePagerClass : current, pagerAnchorBuilder : function idx, slide idx + 1; return + ; ）； jQuery Cycle Plugin插件使用非常简单，如上实例对ID为的DIV元素调用jQuery Cycle Plugin，这样就实现了一个图片循环展示的效果，jQuery Cycle Plugin可选效果非常多，如下：/cycle/browser.html 看这些效果。 blindX blindY blindZ cover curtainX curtainY fade fadeZoom growX growY scrollUp scrollDown scrollLeft scrollRight scrollHorz scrollVert shuffle slideX slideY toss turnUp turnDown turnLeft turnRight uncover wipe zoom 几个常用的使用方法 一，自定义Cycle 循环展示效果 $ #ads .ads .cycle fx: scrollDown ; 其中fx表示需要使用的效果参数，如上：scrollDown 二，自定义Cycle 循环展示的速度和延迟值 $ ‘#ads .ads’ .cycle fx:????fade, speed:??2500 ; 其中speed表示显示的速度 $ ‘#ads .ads’ .cycle fx: scrollDown, speed:????300, timeout:??2000 ; 其中timeout表示显示下一张的延迟值 三，其它应用 $ ‘#ads .ads’ .cycle fx:????fade, pause:??1 ; $ ‘#ads .ads’ .cycle fx: scrollDown, random:??1 ; 插件cycle的代码如下：（jquery.cycle.js）/* * jQuery Cycle Plugin with Transition Definitions * Examples and documentation at: /cycle/ * Copyright c 2007-2010 M. Alsup * Version: 2.86 05-APR-2010 * Dual licensed under the MIT and GPL licenses: * /licenses/mit-license.php * /licenses/gpl.html * Requires: jQuery v1.2.6 or later */ function $ var ver 2.86;if $.support undefined $.support op