实例代码详解jquery.slides.js
Slides–是一个简单的,容易定制和风格化,的jQuery幻灯片插件。
Slides提供褪色或幻灯片过渡效果,图像淡入淡出,图像预压,自动生成分页,循环,自动播放的自定义等很多选项。
用Slides插件,你可以随机播放幻灯片,设定那一套您想要开始幻灯片。它附带充分的说明和示例。
废话不多说了,直接给大家贴代码了
$(function(){ $("#slides").slidesjs({ play:{ active:true, //[boolean]Generatetheplayandstopbuttons. //Youcannotuseyourownbuttons.Sorry. effect:"slide", //[string]Canbeeither"slide"or"fade". interval:, //[number]Timespentoneachslideinmilliseconds. auto:false, //[boolean]Startplayingtheslideshowonload. swap:true, //[boolean]show/hidestopandplaybuttons pauseOnHover:false, //[boolean]pauseaplayingslideshowonhover restartDelay: //[number]restartdelayoninactiveslideshow } }); });
前台:
<!doctypehtml> <head> <style> /*Preventsslidesfromflashing*/ #slides{ display:none; } </style> <scriptsrc="http://code.jquery.com/jquery-latest.min.js"></script> <scriptsrc="jquery.slides.min.js"></script> <script> $(function(){ $("#slides").slidesjs({ width:, height: }); }); </script> </head> <body> <divid="slides"> <imgsrc="http://placehold.it/x"> <imgsrc="http://placehold.it/x"> <imgsrc="http://placehold.it/x"> <imgsrc="http://placehold.it/x"> <imgsrc="http://placehold.it/x"> </div> </body>
以上内容是关于jquery.slides.js的全部代码,希望大家喜欢。