Question

我发现用户在这里发布的代码是一个无缝的jQuery选框/自动收录器。我已经将其修改为在滚动/滚动时启动和停止，但是一旦用户滚动，它通常会滞后。它永远不会完全停止，但是自动收报机滚动的速度有时是其原始速度的1/10。我加快了速度，所以更容易看到这种滞后。无论如何，如果有人知道如何解决这个问题，我将非常感激。

的jQuery

 $(function() {
  var marquee = $("#scroller");
  marquee.css({"overflow": "hidden", "width": "100%"});

  // wrap "My Text" with a span (IE doesn't like divs inline-block)
   marquee.wrapInner("<span>");
  marquee.find("span").css({ "width": "49%", "display": "inline-block", "text-align":"center", "padding-right":"1%" });
  marquee.append(marquee.find("span").clone()); // now there are two spans with "My Text"

   marquee.wrapInner("<div class='scrolling'>");
  marquee.find("div").css("width", "200%");

  var reset = function() {
       $(this).css({"margin-left":"0%"});
       $(this).animate({ "margin-left": "-100%" }, 500, 'linear', reset);
  };

  reset.call(marquee.find("div"));

  marquee.find("div").bind({
mouseenter: function () {
 $(this).stop();
 if($(this).css("margin-left") == "-"+$("#scroller").width() + "px") $(this).css("margin-left", "0%");
},
mouseleave: function() {
 $(this).stop().animate({ "margin-left": "-100%" }, 500, 'linear', reset);
}
});
});

HTML

<div id="scroller">
  Lorem ipsum dolor sit amet. &mdash; <a href="#">Username</a>&nbsp;&nbsp;&nbsp;
  Lorem ipsum dolor sit amet. &mdash; <a href="#">Username</a>&nbsp;&nbsp;&nbsp;
  Lorem ipsum. &mdash; <a href="#">Username</a>&nbsp;&nbsp;&nbsp;
  Lorem ipsum dolor sit amet. &mdash; <a href="#">Username</a>&nbsp;&nbsp;&nbsp;
  Lorem ipsum dolor sit amet. &mdash; <a href="#">Username</a>&nbsp;&nbsp;&nbsp;
  Lorem ipsum dolor sit amet. &mdash; <a href="#">Username</a>&nbsp;&nbsp;&nbsp;
  Lorem ipsum. &mdash; <a href="#">Username</a>&nbsp;&nbsp;&nbsp;
  Lorem ipsum dolor sit amet. &mdash; <a href="#">Username</a>&nbsp;&nbsp;&nbsp;
 </div>

谢谢，

格雷格

Answer 1

很高兴您找到了足够的答案，但它似乎非常复杂，寻找类似解决方案的新用户无疑会感到困惑，除非他们在javascript中相当了解。一个类似的jQuery插件，具有所有功能;滚动条停止并开始回调，鼠标悬停时自动暂停，以便您清楚地阅读/单击正确的项目。无缝过渡，完全控制方向和速度。您可能希望查看jQuery webTicker这是一个免费使用的插件，所以尽情享受。

Answer 2

似乎答案在于JQuery在.clone（）和.remove（）调用中管理内存的方式。有一个非常好的讨论：

jQuery memory leak with DOM removal

有关详细信息和解决方法，请访问：

http://forum.jquery.com/topic/severe-memory-leak-with-clone

祝你好运！

无缝JQuery选框/自动收报机

的jQuery

HTML

2 个答案: