jQuery script have problems

129 Views Asked by At

I used this script that I found online ( https://codepen.io/erickarbe/pen/gyfFB ) but after the first loop it just gets stuck in the middle and goes back to the start, if you give it a look it doesnt work properly, if anyone could help me figure it out it would be great !

$jQuery.fn.liScroll = function(settings) {
  settings = jQuery.extend({
    travelocity: 0.03
  }, settings);     
  return this.each(function(){
    var $strip = jQuery(this);
    $strip.addClass("newsticker")
    var stripHeight = 1;
    $strip.find("li").each(function(i){
      stripHeight += jQuery(this, i).outerHeight(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 containerHeight = $strip.parent().parent().height();    //a.k.a. 'mask' width   
    $strip.height(stripHeight);         
    var totalTravel = stripHeight;
    var defTiming = totalTravel/settings.travelocity;   // thanks to Scott Waye     
    function scrollnews(spazio, tempo){
      $strip.animate({top: '-='+ spazio}, tempo, "linear", function(){$strip.css("top", containerHeight); scrollnews(totalTravel, defTiming);});
    }
    scrollnews(totalTravel, defTiming);             
    $strip.hover(function(){
      jQuery(this).stop();
    },
    function(){
      var offset = jQuery(this).offset();
      var residualSpace = offset.top + stripHeight;
      var residualTime = residualSpace/settings.travelocity;
      scrollnews(residualSpace, residualTime);
    });         
  });   
};

$(function(){
  $("ul#ticker01").liScroll();
});
1

There are 1 best solutions below

2
user2676208 On

The only way I find that the following iterations differ from the first is that they stop at the end of the list as opposed to sliding all the way up the screen another time.

That is because when scrollnews calls itself recursively to restart, it assumes it just needs to travel literally the height it's told, ignoring the extra scrolling distance picked up when starting over with the extra positive offset. So, you'd want to change the scrollnews call to scrollnews(totalTravel + containerHeight, defTiming)

That may throw off the timing ratio they have set up, though.