javascript 层定位滚动

最新推荐文章于 2025-12-02 21:41:05 发布

原创最新推荐文章于 2025-12-02 21:41:05 发布 · 811 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #function

本文介绍了如何使用JavaScript实现页面元素的动态层定位与跟随滚动效果。通过监听滚动与调整窗口大小事件，确保指定的层始终处于屏幕中央，并且能够随着用户的滚动而自动调整位置。

层滚动

function scrolldivs()
{
document.getElementById("scrolldiv").style.top=document.documentElement.scrollTop+(document.documentElement.clientHeight-document.getElementById("scrolldiv").offsetHeight)/2+"px";
document.getElementById("scrolldiv").style.left=document.documentElement.scrollLeft+(document.documentElement.clientWidth-document.getElementById("scrolldiv").offsetWidth)/2+300+"px";
}

window.onscroll=scrolldivs;
window.onresize=scrolldivs;
window.onload=scrolldivs;

层定位

function PopupWin(evn) //evn参数代表event事件
{
    var divfaces = document.getElementById("stufaces");
    divfaces.style.top=evn.clientY+document.body.scrollTop+document.documentElement.scrollTop-150+"px";
    divfaces.style.left=evn.clientX+document.body.scrollLeft+document.documentElement.scrollLeft+150+"px";
    divfaces.style.display="block";
}