jQuery：可见 html 元素的通知答案

【问题标题】：jQuery: notification of visible html elementsjQuery：可见 html 元素的通知
【发布时间】：2010-07-15 20:05:59
【问题描述】：

我希望能够找出页面元素何时打开或关闭查看器屏幕。具体来说，我希望能够“关闭”一个 html 5 画布 (Processing.js) 脚本，如果用户滚动过画布并在用户浏览器中再次可见时重新打开。

这有意义吗？我认为 DOM 必须有某种方式通过 ajax 触发通知以打开和关闭画布脚本。

谢谢。

/////////// 编辑（最终代码） ////////// 这是我使用的最终代码：

$(window).bind('scroll', function(){
   var $canvas = $('#canvas');
   var pos     = $canvas.offset();
   var total = pos.top + $($canvas).height();
   var wndtop  = $(this).scrollTop();

   if(wndtop <= pos || wndtop >= total ){ 

   }

});

【问题讨论】：

试试appelsiini.net/projects/viewport，它可以让你根据当前是否可以查看元素来选择元素，你可以在每个滚动事件中检查它吗？

标签： jquery html canvas

【解决方案1】：

您可以将事件处理程序附加到window scrolling。喜欢

$(window).bind('scroll', function(){
   var $canvas = $('#hlogo');
   var pos     = $canvas.offset();
   var wndtop  = $(this).scrollTop();
   var wndleft = $(this).scrollLeft();

   if(wndtop <= pos.top && wndleft <= pos.left)
      $canvas.hide();
});

【讨论】：

【解决方案2】：

您可以通过使用 DOM 属性 element.y、element.style,height 和 window.scrollY 来做到这一点。

【讨论】：

【解决方案3】：

您应该能够根据需要调整以下链接中的代码。 Check if element is visible after scrolling

【讨论】：