jquery 图片间隙滚动

1.先引进jquery.js框架,

  与有些网站上的image_scroller.js插件有些不一样，实现定时滚动和鼠标停留时停止滚动。

 

2.css样式:

  

<style>
   .shares{width:300px;height:500px;overflow:hidden;}
   .sharesbox li{float:left;}
</style>

 

 

3.html格式：

 

<div class="shares">
   <ul class="sharesbox">
         <li>....</li>
         <li>....</li>
         <li>....</li>
   </ul>
</div>

 

 

 

4.js代码配置

$(document).ready(function(){
   
   //评论切换
   $(".shares").imageScroller({
      frame: ".sharesbox",
      child: "li",
      auto: true,  //是否自动播放
      space_time: 2800,
      ptype: 'bottom'   //类型：left从左到右，right从右到左，bottom从上到下
   });
   
});