2011-04-11 83 views
12

当滚动条移动时,我必须移动div,但需要使用纯javascript,并且position:fixed将不能用于布局。该div的原始渠道是相对于其他东西。是否有一个简单的实现使用像onScroll这样的事件来检测页面向上或向下移动的像素数量,并相应地更改div的位置。 div只需要垂直移动。所以,如果我可以检测到页面移动了多少像素,我可以将其添加到div的位置或将其减去。任何帮助是极大的赞赏 :-)。带滚动的移动div

+1

所以你现在是...(这是你粘贴代码段你这样做的远)什么 – 2011-04-11 03:00:37

回答

15
window.onscroll = function (e) { 
    var vertical_position = 0; 
    if (pageYOffset)//usual 
    vertical_position = pageYOffset; 
    else if (document.documentElement.clientHeight)//ie 
    vertical_position = document.documentElement.scrollTop; 
    else if (document.body)//ie quirks 
    vertical_position = document.body.scrollTop; 

    var your_div = document.getElementById('some_div'); 
    your_div.top = (vertical_position + 200) + 'px';//200 is arbitrary.. just to show you could now position it how you want 
} 
+2

你,在每一个浏览器我尝试在完美地工作真棒:-)非常感谢你帮助我。 – rubixibuc 2011-04-11 04:29:37

+0

@Jake首先它必须是your_div.style.top(代码中缺少样式)不是吗?而且这也只能移动一次div而不是我们滚动。请纠正我,如果我错了! – Ashwin 2015-11-16 09:04:57

+0

用'your_div.style.top'代替'your_div.top' – ZiTAL 2016-12-26 10:25:10