Slides – 是一个简单的，容易定制和风格化，的jQuery幻灯片插件。
Slides提供褪色或幻灯片过渡效果，图像淡入淡出，图像预压，自动生成分页，循环，自动播放的自定义等很多选项。
用Slides插件，你可以随机播放幻灯片，设定那一套您想要开始幻灯片。它附带充分的说明和示例。
DEMO地址：http://slidesjs.com/
官网地址：http://slidesjs.com/
基本的HTML结构
1 <!doctype html> 2 <head> 3 <title>Title</title> 4 5 <style type="text/css" media="screen"> 6 .slides_container { 7 570px; 8 height:270px; 9 } 10 .slides_container div { 11 570px; 12 height:270px; 13 display:block; 14 } 15 </style> 16 17 <script src="http://code.jquery.com/jquery-latest.min.js"></script> 18 <script src="slides.js"></script> 19 20 <script> 21 $(function(){ 22 $("#slides").slides(); 23 }); 24 </script> 25 </head> 26 <body> 27 <div id="slides"> 28 <div class="slides_container"> 29 <div> 30 <img src="http://placehold.it/570x270"> 31 </div> 32 <div> 33 <img src="http://placehold.it/570x270"> 34 </div> 35 <div> 36 <img src="http://placehold.it/570x270"> 37 </div> 38 <div> 39 <img src="http://placehold.it/570x270"> 40 </div> 41 </div> 42 </div> 43 </body>
个性化定制
1 $(function(){ 2 $("#slides").slides({ 3 preload: true, 4 preloadImage: '/img/loading.gif', 5 play: 5000, 6 pause: 2500, 7 hoverPause: true 8 }); 9 });