设置一个有滚动条的页面
css
body { height: 1000px; } #div1 { height: 300px; width: 300px; background: red; }
js
var div = document.getElementById(‘div1‘); window.onclick = function(e) { //若document.body小于视区,点击超出的位置就无法获取。而window可以 var e = e || window.event; // alert(e.clientX + ‘,‘ + e.clientY); //这个是相对于浏览器的位置,不包含已滚动的位置 ->视区位置 // alert(e.pageX + ‘,‘ + e.pageY); //这个是页面page的位置,包含已滚动的位置 ->文档位置 // alert(e.screenX + ‘,‘ + e.screenY); //这个是相对于屏幕坐标位置 //ie8下不支持页面坐标,要用客户区坐标+滚动信息得到 滚动两种分别是混杂模式和标准模式中的scroll信息 var x = document.body.scrollLeft || document.documentElement.scrollLeft + e.clientX; var y = document.body.scrollTop || document.documentElement.scrollTop + e.clientY; alert(x + ‘,‘ + y); }
坐标位置小结
时间: 2024-10-12 08:14:27