复制代码代码如下：DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN ' ' http://www .w3。org/TR/XHTML 1/DTD/XHTML 1-Transitional。DTD ' html xmlns=' http://www .w3。org/1999/XHTML '标题可配置横栏滚动演示/标题元http-equiv='内容类型'内容=' text/html；charset=utf-8 '/style type=' text/CSS ' * { margin :0；划水：0;}正文{ font-size :12 px}/style脚本src=' http : jquery-1。4 .1 .js ' type=' text/JavaScript '/script style type=' text/CSS ' # scroll { background-color : # EFE fef；border:1px实心# dddpadding:10px 8px宽度宽度：523 pxh 8 :65 pxmargin-top :30 px；} div。项目{高度：66 px边距-左侧：8 pxfloat:left宽度：475px！重要；} div。项目a {显示：块；float:left右边距：8 px宽度：88 px高度：66 px背景# BBB font-size :50 px；color: # ccc线高：66 px文本装饰：无；文本对齐：居中；光标：指针指针；} div。项目a :悬停{ color : # 999} div。项目a .活动{背景-位置：-174 px 0；color : # 555 cursor : default } a . prev，a . next { background : URL(左。png)无重复0 0；显示：块；宽度：18 pxheight :18 pxfloat : leftmargin :22 px 0 0 0 cursor :指针指针；} a .下一个{背景图像： URL(右。png)} a . prev :悬停{背景-位置：0-18px；} a .下一个：悬停{背景-位置：0-18px；}/样式脚本语言=' JavaScript '类型=' text/JavaScript '(函数($) { $.fn.extend({ Scroll:函数(opt，回调){ if(！opt)var opt={ }；var _ BTN左=$(选择。左)；var _ BTN右=$(选择。右)；var timerIDvar _this=this.eq(0).查找(' div ').等式(1);var LineW=_ this。查找(' a : first ').width()，//获取列宽line=opt.line？parseInt(opt.line，10): parseInt(_ this。width()/LineW，10)，//每次滚动的列数，默认为一屏，即父容器列宽速度=选择。速度？parsent(opt。速度，10): 500；//滚动速度，数值越大，速度越慢（毫秒)timer=opt.timer？parsent(opt。计时器，10): 3000；//滚动的时间间隔（毫秒)if(line==0)line=1；定义变量逆风=0线*线w；//滚动函数var scrolleft=function(){ if(！_这个。是(' :动画'){ _ this。动画({左：逆风})，速度，函数(){ for(I=1；i=线；i ) { _this.find('a:first ').appendo(_ this)；} _这个。CSS({左： { 0 })；});} } var scrollRight=function () { if(！_这个。是(' :动画'){ for(I=1；i=线；i ) { _this.find('a:last ').显示()。前置到(_ this)；} _this.css({ left:逆风});_this.animate({ left: 0 }，速度，函数(){ });} }//肖菲：自动播放var autoPlay=function(){ if(timer)timerID=window。set interval(scroll ft，timer)；};var autoStop=function(){ if(timer)窗口。clear interval(TiMerid)；};//鼠标事件绑定_this.hover(自动停止，自动播放)。鼠标移出()；_ btnleft.css('光标','指针')。单击（滚动)。悬停（自动停止、自动播放);_btnright.css('光标','指针')。单击（向右滚动)。悬停（自动停止、自动播放);} })})(jQuery)；$(文档)。ready(function(){ $(' # scroll ')).滚动({ line: 5，speed: 500，timer: 3000，left: ' .' prev '，右： '。next ' })；});/script/head body div style=' margin 33600 auto；宽度width:500px'div id='可滚动a class=' prev ' href=' # '/a div class=' items ' style=' overflow :隐藏；相对位置：可见性：可见；宽度' : 478像素；div style=' position :绝对值；宽度' : 200000 em'left : 0px ' class=' scroll _ demo ' a1/a a2/a a3/a a4/a a5/a a6/a a7/a A8/a a9/a a10/a a11/a a12/a a13/a a14/a a15/a/div br clear=' all '/div a class=' next ' href=' # '/a/div/body/html说明：1、需要两个图片左巴布亚新几内亚：

右。巴布亚新几内亚：

2、需要引入框架的包，这个应该不用说的.脚本src=' http :http://www。cn博客。com/端妤/admin/jquery-1。3 .1 .js ' type=text/JavaScript/script脚本语言=JavaScript type=text/JavaScript/(函数($){ $ .fn。extend({ scroll :函数(opt，callback) { //参数初始化if(！opt)var opt={ }；var _ BTN左=$(选择。左)；var _ BTN右=$(选择。右)；var timerIDvar _this=this.eq(0).查找(' div ').等式(1);var LineW=_ this。查找(' a : first ').width()，//获取列宽line=opt.line？parseInt(opt.line，10): parseInt(_ this。width()/LineW，10)，//每次滚动的列数，默认为一屏，即父容器列宽速度=选择。速度？parsent(opt。速度，10): 500；//卷动速度，数值越大，速度越慢（毫秒)timer=opt.timer？parsent(opt。计时器，10): 3000；//滚动的时间间隔（毫秒)if(line==0)line=1；定义变量逆风=0线*线w；//滚动函数var scrolleft=function(){ if(！_这个。是(' :动画'){ _ this。动画({左：逆风})，速度，函数(){ for(I=1；i=线；i ) { _this.find('a:first ').appendo(_ this)；} _这个。CSS({左： { 0 })；});} } var scrollRight=function () { if(！_这个。是(' :动画'){ for(I=1；i=线；i ) { _this.find('a:last ').显示()。前置到(_ this)；} _this.css({ left:逆风});_this.animate({ left: 0 }，速度，函数(){ });} }//肖菲：自动播放var autoPlay=function(){ if(timer)timerID=window。set interval(scroll ft，timer)；};var autoStop=function(){ if(timer)窗口。clear interval(TiMerid)；};//鼠标事件绑定_this.hover(自动停止，自动播放)。鼠标移出()；_ btnleft.css('光标','指针')。单击（滚动)。悬停（自动停止、自动播放);//肖菲：向上向下鼠标事件绑定_btnright.css('光标','指针')。单击（向右滚动)。悬停（自动停止、自动播放);} })})(jQuery)；$(文档)。ready(function(){ $(' # scroll ')).滚动({ line: 5，speed: 500，timer: 3000，left: ' .' prev '，右： '。next ' })；});///脚本