Question

当我在侧边栏上滚动时，我想更改图像。我使用了每个函数和scrollto。

代码的主要部分：

$('.image-content').each(function(index, element) {
  var imagePosition = $(element).offset().top;
  var imageDefault = $('.image-content:eq(0)').offset().top;
  var called = false;

  $('.sidebar').scroll(function() {
    var scrollPosition = $('.sidebar').scrollTop();

    if ( scrollPosition >= imagePosition ) {
      if (!called) {
        called = true;
        coverImage(index, element);
      }
    } else if ( scrollPosition <= imageDefault ) {
      // if (!called) {
        // called = true;
        defaultcover();
      // }
    }
  });
});

我创建了一个名为的变量，不重复函数调用（coverImage），否则它会一直改变图像链接。在第一个滚动条中，它运行良好，但是当我滚动到顶部时，它不再起作用，因为被调用的变量设置为true。 （我不想使用任何插件）

JSFIDDLE

我该如何解决这个问题？

Answer 1

如果删除

  called = true;

这

 if ( scrollPosition >= imagePosition ) {
      if (!called) {
        called = true;
        coverImage(index, element);
      }
 }

然后怎么了？因为它似乎正在发挥作用。

滚动事件期间更改图像

1 个答案: