一個jquery實現的不錯的多行文字圖片滾動效果，jquery多行

一個jquery實現的不錯的多行文字圖片滾動效果，jquery多行

今兒分享一個jquery實現多行滾動效果。

我看一些論壇網站上面，公告處用的較多。

代碼如下

// 多行滾動(function($){$.fn.extend({Scroll:function(opt,callback){if(!opt) var opt={};var _this=this.eq(0).find("ul:first");var lineH=_this.find("li:first").height(),line=opt.line?parseInt(opt.line,10):parseInt(this.height()/lineH,10),speed=opt.speed?parseInt(opt.speed,10):1000, //捲動速度，數值越大，速度越慢（毫秒）timer=opt.timer?parseInt(opt.timer,10):5000; //滾動的時間間隔（毫秒）if(line==0) line=1;var upHeight=0-line*lineH;scrollUp=function(){_this.animate({marginTop:upHeight},speed,function(){for(i=1;i

執行個體示範

代碼如下

<div id="scrollDiv"><ul><li>我是jquery多行捲軸一</li><li>我是jquery多行捲軸二</li><li>我是jquery多行捲軸三</li><li>我是jquery多行捲軸四</li><li>我是jquery多行捲軸五</li><li>我是jquery多行捲軸六</li><li>我是jquery多行捲軸七</li><li>我是jquery多行捲軸八</li></ul></div>

<script type="text/javascript" src="http:/(www.jb51.net)/ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script><script type="text/javascript">// 多行滾動(function($){$.fn.extend({Scroll:function(opt,callback){if(!opt) var opt={};var _this=this.eq(0).find("ul:first");var lineH=_this.find("li:first").height(),line=opt.line?parseInt(opt.line,10):parseInt(this.height()/lineH,10),speed=opt.speed?parseInt(opt.speed,10):1000, //捲動速度，數值越大，速度越慢（毫秒）timer=opt.timer?parseInt(opt.timer,10):5000; //滾動的時間間隔（毫秒）if(line==0) line=1;var upHeight=0-line*lineH;scrollUp=function(){_this.animate({marginTop:upHeight},speed,function(){for(i=1;i<=line;i++){_this.find("li:first").appendTo(_this);}_this.css({marginTop:0});});}_this.hover(function(){clearInterval(timerID);},function(){timerID=setInterval("scrollUp()",timer);}).mouseout();}})})(jQuery);$(document).ready(function(){$("#scrollDiv").Scroll({line:4,speed:1000,timer:2000});});</script>

jquery圖片滾動的效果代碼

把你郵箱告訴我，我給你發過去，如果收到了，有用的話，請採納
 
jquery實現圖片滾動效果，急

你好，你看一下，你要的是不是這個效果：d.lanrentuku.com/down/js/jiaodiantu-785/