基于动画无缝滚动

/* @ 无缝滚动===================================*/function Marquee( stage, list ){if( !stage || list.length <= 1 )return;this.stage = stage;this.list = list;this.step = 20;this.count = this.list.length;this.imgs = M.$( "img", this.stage );this.lock = false;this.isClone = true;this.auto = null;this.timer = 2000;this.start();}Marquee.prototype = {start : function(){var _this = this;if( _this.count > 1 ){_this.stage.onmouseover = function(){_this.lock = true;}_this.stage.onmouseout = function(){_this.lock = false;}if( _this.isClone ){ //防止重复克隆var html = _this.stage.innerHTML;html += html;_this.stage.innerHTML = html;_this.isClone = false;}}for( var i=0,ii=_this.imgs.length;i<ii;i++ ){if( _this.imgs[i] &&  _this.imgs[i].getAttribute( "lazy-src" ) ){ _this.imgs[i].src =  _this.imgs[i].getAttribute( "lazy-src" ); _this.imgs[i].removeAttribute( "lazy-src" );}}_this.auto = setInterval( function(){_this.move();}, _this.timer );},move : function(){var _this = this;if( _this.lock )return;var to = parseInt( _this.stage.style.marginTop ) || 0;if( to <= ( _this.count ) * (-_this.step) + _this.step ){setTimeout(function(){_this.stage.style.marginTop = "0px";to = 0;},1000);} to -= _this.step;M.Animate( _this.stage , {marginTop:to+"px"} , 200 ,'linear' );},stop : function(){var _this = this;clearInterval( _this.auto );}}//讨论区公告new Marquee( M.$("#JS_marquee_discuss"), M.$("a", "#JS_marquee_discuss") );

<div class="marquee Right"><span><strong class="txt">号外：</strong><span><div class="stage"><div id="JS_marquee_discuss"><!--{foreach from=$yqzx_tag item=item}--><a href="{$item.url}" target="_blank" title="{$item.topic_name}">{$item.topic_name|truncate:35}</a><!--{/foreach}--></div></div></div>