圆形方形水平滚动器

时间:2013-02-08 12:24:00

标签: jquery scroll

我想修改此滚动以循环方式连续循环,而不是等待最后一个元素,然后再次开始滚动。

jQuery.fn.liScroll = function(settings) {
        settings = jQuery.extend({
           travelocity: 0.07
        }, settings);       
        return this.each(function(){
                var $strip = jQuery(this);
                $strip.addClass("newsticker")
                var stripWidth = 20;
                $strip.find("li").each(function(i){
                   stripWidth += jQuery(this, i).outerWidth(true); // thanks to Michael Haszprunar and Fabien Volpi
                });
                var $mask = $strip.wrap("<div class='mask'></div>");
                var $tickercontainer = $strip.parent().wrap("<div class='tickercontainer'></div>");                             
                var containerWidth = $strip.parent().parent().width();  //a.k.a. 'mask' width   
                $strip.width(stripWidth);           
                var totalTravel = stripWidth+containerWidth;
                var defTiming = totalTravel/settings.travelocity;   // thanks to Scott Waye     
                function scrollnews(spazio, tempo){
                   $strip.animate({left: '-='+ spazio}, tempo, "linear", function(){$strip.css("left", containerWidth); scrollnews(totalTravel, defTiming);});//defTiming
                }
                scrollnews(totalTravel, defTiming);             
                $strip.hover(function(){
                   jQuery(this).stop();
                },
                function(){
                   var offset = jQuery(this).offset();
                   var residualSpace = offset.left + stripWidth;
                   var residualTime = residualSpace/settings.travelocity;
                   scrollnews(residualSpace, residualTime);
                });         
        }); 
};

1 个答案:

答案 0 :(得分:0)

一个名为simplyscroll的jQuery插件可能就是你要找的东西: http://logicbox.net/jquery/simplyscroll/horizontal.html