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从上到下 }); });