【问题标题】:Ticker won't cycle round and stops before reaches bottomTicker 不会循环并在到达底部之前停止
【发布时间】:2013-06-29 12:52:35
【问题描述】:

我已尝试在本网站大部分页面的右侧栏上添加一个代码:http://www.black-kite.co.uk/services [例如]。

它部分工作。由于某种原因,自动收报机没有到达最后一项的底部,并停止旋转。我希望它在无限循环中旋转。

使用的jquery在这里:

$(function() {  

  //cache the ticker  
  var ticker = $("#ticker");  

  //wrap dt:dd pairs in divs  
  ticker.children().filter("dt").each(function() {  

    var dt = $(this),  
      container = $("<div>");  

    dt.next().appendTo(container);  
    dt.prependTo(container);            
    container.appendTo(ticker);  
  });  

  //hide the scrollbar  
  ticker.css("overflow", "hidden");  

  //animator function  
  function animator(currentItem) {  

    //work out new anim duration  
    var distance = currentItem.height(),  
    duration = (distance - Math.abs(parseInt(currentItem.css("marginTop")))) / 0.025;  

    //animate the first child of the ticker  
    currentItem.animate({ marginTop: -distance }, duration, "linear", function() {  

      //move current item to the bottom     
      currentItem.appendTo(currentItem.parent()).css("marginTop", 0);  

    //recurse  
    animator(currentItem.parent().children(":first"));  
    });   
  };  

  //start the ticker  
  animator(ticker.children(":first"));  

  //set mouseenter  
ticker.mouseenter(function() {  

  //stop current animation  
  ticker.children().stop();  

});  

//set mouseleave  
ticker.mouseleave(function() {  

  //resume animation  
  animator(ticker.children(":first"));  
});  

});  

我也做了一个jsfiddle:http://jsfiddle.net/BsjpV/

如果有任何帮助或指点,我将不胜感激,我只是在学习 jquery/javascript 类型的东西!谢谢!

【问题讨论】:

  • 我没看到这两个问题jsfiddle.net/mattydsw/BsjpV/1你用的是哪个浏览器?
  • 我尝试过 Chrome、Safari 和 Firefox。我根本看不到它们旋转...但是查看您在其中放入图片的 jquery [对不起,我忘记放入实际图片!] 我看到您没有改变任何东西,但它可以工作...我是现在很困惑!
  • 当您在 black-kite.co.uk/about.php 上查看它时,例如 [rhs bar, in the clients/partners box] 它对您有用吗?
  • 感谢您的帮助 - 这是一行无意中注释掉的代码。

标签: jquery ticker


【解决方案1】:

无意中注释掉的代码行是导致问题的原因...

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-05-20
    • 2019-07-29
    • 1970-01-01
    • 2019-01-17
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多