0

我尝试使用 Google 来解决我的问题，但我没有找到解决方案。我编写了一个小的 jQuery 脚本，它可以独立地上下滑动两个 div 容器。为了重复这个无限滑动，我使用了递归调用。这是我的代码：

jQuery.fn.scroller = function() {
      var scrollamount = $(this).height() - $(window).height();
      var scrollduration = scrollamount * 10;
      var pauseduration = 3000;
      var docheight = $(this).height();
      var doScroll = function () {
          $(this).delay(pauseduration)
              .animate({top: -scrollamount, height: docheight}, scrollduration, 'linear')
              .delay(pauseduration)
              .animate({top: 0, height: $(window).height()}, scrollduration, 'linear', $(this).doScroll);

          };
      $(this).height($(window).height()).doScroll();
      };
$(document).ready(function(){
    $('#globdiv').scroller();
    $('#globdiv2').scroller();
    });

错误控制台指示 doScroll 在这一行

$(this).height($(window).height()).doScroll();

不是函数。我找到了另一种解决方案：

$.fn.doScroll = function(pauseduration, scrollamount, scrollduration, docheight) {
          $(this).delay(pauseduration)
              .animate({top: -scrollamount, height: docheight}, scrollduration, 'linear')
              .delay(pauseduration)
              .animate({top: 0, height: $(window).height()}, scrollduration, 'linear', function(){
                  $(this).doScroll(pauseduration, scrollamount, scrollduration, docheight);
              });
     };
$.fn.scroller = function(){
      var scrollamount = $(this).height() - $(window).height();
      var scrollduration = scrollamount * 10;
      var pauseduration = 3000;
      var docheight = $(this).height();
      $(this).height($(window).height()).doScroll(pauseduration, scrollamount, scrollduration, docheight);
      };
$(document).ready(function(){
    $('#globdiv').scroller();
    $('#globdiv2').scroller();
    });

效果很好，但我想了解为什么我的第一种方法不起作用以及我可以做些什么来让它运行。最好的问候 - 乌尔里希

4

2 回答 2

0

函数 .doScroll 不适用于 $(this) 但对于“this”，这就是链接不起作用的原因，试试这个：

$(this).height($(window).height());
this.doScroll();
于 2013-05-21T22:28:38.827 回答
0

您的第一种方法不起作用，因为doScroll它不是jQuery对象上的方法，它只是一个本地函数。你可以让它像这样工作：

doScroll.apply($(this).height($(window).height()));

或者您可以更改 doScroll 的签名以接受元素/jQuery 对象作为参数：

var doScroll = function (ele) {
          $(ele).delay(pauseduration)
              .animate({top: -scrollamount, height: docheight}, scrollduration, 'linear')
              .delay(pauseduration)
              .animate({top: 0, height: $(window).height()}, scrollduration, 'linear', function (){doScroll(ele);})};

          };
          doScroll($(ele).height($(window).height()));
      };
于 2013-05-21T22:25:54.980 回答