选择已滚动到的元素

发布于 2024-11-29 13:00:55 字数 87 浏览 0 评论 0原文

我有一个使用 Jquery ScrollTo 插件的滚动网站。我想做的是选择刚刚滚动到的部分中的一个元素,以便在该元素在屏幕上可见时我可以为其设置动画。 建议?

I have a scrolling site that uses the Jquery ScrollTo plugin. What I am trying to do is to select an element within the section that has just been scrolled to so that I can animate it once the element is visible on screen.
suggestions?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

硪扪都還晓 2024-12-06 13:00:55

您可以在scrollTo插件的onAfter事件中找到元素的顶部并与文档scrollTop进行比较。

$("div").scrollTo({
  onAfter: function(){//This is the callback function when the scrolling animation is complete.
  var scrollTop = $(document).scrollTop();
  var scrollLeft = $(document).scrollLeft();
  var elementWidth = $("div").find("elementToFind").width();
  var elementOffset = $("div").find("elementToFind").offset();
  var elementTop = elementOffset.top;
  var elementLeft =elementOffset.left;

  if((elementTop > scrollTop) && (elementTop < $(window).height() + scrollTop) &&
     ( elementLeft > scrollLeft) && ( (elementLeft + elementWidth) < $(window).width() + scrollLeft)){
    //The element is visible do something here
  } 
}

  });
})

You can find the top of the element and compare with document scrollTop in the onAfter event of scrollTo plugin.

$("div").scrollTo({
  onAfter: function(){//This is the callback function when the scrolling animation is complete.
  var scrollTop = $(document).scrollTop();
  var scrollLeft = $(document).scrollLeft();
  var elementWidth = $("div").find("elementToFind").width();
  var elementOffset = $("div").find("elementToFind").offset();
  var elementTop = elementOffset.top;
  var elementLeft =elementOffset.left;

  if((elementTop > scrollTop) && (elementTop < $(window).height() + scrollTop) &&
     ( elementLeft > scrollLeft) && ( (elementLeft + elementWidth) < $(window).width() + scrollLeft)){
    //The element is visible do something here
  } 
}

  });
})
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文