js中实现滚屏效果方法总结

   

• 这是公告标题的第一行

   

• 这是公告标题的第二行

   

• 这是公告标题的第三行

   

• 这是公告标题的第四行

   

• 这是公告标题的第五行

   

• 这是公告标题的第六行

   

• 这是公告标题的第七行

   

• 这是公告标题的第八行

 

jQuery.fn.extend({

     justUp : function(aSpeed,duration)

     {

         this.css({"height":"25px","line-height":"25px"});

         this.each(function(){

             var _this = this;               

             var iTimer=0;

             function scroll(){

                iTimer = setInterval(function(){

                $(_this).animate({marginTop:"-25px"},aSpeed||500,function(){$(_this).css

({marginTop:"0px"}).find("li:first").appendTo(_this);});

                 },duration||3000);

             }

             scroll();

             $(this).hover(function(){this.style.cursor = "pointer";clearInterval(iTimer);},scroll);

          });

     }

});

// 水平滚动插件

(function($){

$.fn.extend({

Scroll:function(opt,callback){
//参数初始化
if(!opt) var opt={};
var _btnRight = $("#"+ opt.right);//Shawphy:向右按钮
var _btnLeft = $("#"+ opt.left);//Shawphy:向左按钮
var timerID;
var _this=this.eq(0).find("ul:first");
var     lineW=_this.find("li:first").width(), //获取列表宽度
line=opt.line?parseInt(opt.line,10):parseInt(this.width()/lineW,10), //每次滚动的行数，默认为一屏，即父

容器高度
speed=opt.speed?parseInt(opt.speed,10):500; //卷动速度，数值越大，速度越慢（毫秒）
 timer=opt.timer //?parseInt(opt.timer,10):3000; //滚动的时间间隔（毫秒）
if(line==0) line=1;
var rightWidth=0-line*lineW;