我想知道用户何时在我的$('#content')
div 中点击。有时可以滚动屏幕,使窗口显示$('#content')
在其实际位置的上方或下方。如果用户的点击在 div 内,我将布尔值标记incanvas
为 true。
这是我在点击处理程序中获得的相关代码:
$content = $('#content');
ctop = $content.offset().top;
cleft = $content.offset().left;
cwidth = parseInt($content.css('width').replace("px",""));
cheight = parseInt($content.css('height').replace("px",""));
eX = parseInt(e.clientX); eY = parseInt(e.clientY);
inwidth = false;
inheight = false;
incanvas = false;
if(eX >= cleft && eX <= (cleft+cwidth)) inwidth=true;
if(eY >= ctop && eY <= (ctop+cheight)) inheight=true;
console.log("inwidth: " + inwidth +", inheight: " + inheight);
if(inwidth && inheight) incanvas = true;
if(incanvas) alert ("Clicked within canvas."); else alert ("Missed.");
这段代码工作得非常好,除非用户滚动页面以使content
div 在页面上向上或向下移动。什么是跨浏览器的方式来确保我的变量ctop
和cleft
包含滚动的位置?