关于用Javascript写获取当前div高度，鼠标滚动一下显示对应高度怎么写？例如下面这个事例，我用鼠标滚动一下，显示page1的高度，再滚动一下，显示page2的高度。这样怎么写？<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> .main{width: 100%; height: auto;} #page1{width: 100%; height: 600px; background: red;} #page2{width: 100%; height: 500px; background: yellow;} #page3{width: 100%; height: 700px; background: green;} #page4{width: 100%; height: 400px; background: blue;} </style> <script type="text/javascript"> window.onload=function() { var page1=document.getElementById("page1"); page1.style.height='600px'; } </script> </head> <body> <div class="main"> <div id="page1">1</div> <div id="page2">2</div> <div id="page3">3</div> <div id="page4">4</div> </div> </body></html>
1 回答
SuperManSuperWorld
TA贡献6条经验 获得超0个赞
<div id="wrap">
<div id="item1">1</div>
<div id="item2">2</div>
<div id="item3">3</div>
<div id="item4">4</div>
</div>
<script>
function getScrollTop(){
var scrollTop=0;
if(document.documentElement && document.documentElement.scrollTop){
scrollTop=document.documentElement.scrollTop;
}else if(document.body){
scrollTop=document.body.scrollTop;
}
return scrollTop;
}
//var scrollTop=getScrollTop();
window.onscroll=function(){
var scrollTop=getScrollTop();
var item1=document.getElementById('item1');
var item2=document.getElementById('item2');
var item3=document.getElementById('item3');
var item4=document.getElementById('item4');
if(scrollTop<460){
console.log('1Width: '+item1.offsetWidth+' 1Height: '+item1.offsetHeight);
}else if(scrollTop>460 && scrollTop<848){
console.log('2Width: '+item2.offsetWidth+' 2Height: '+item2.offsetHeight);
}else if(scrollTop>848 && scrollTop<1400){
console.log('3Width: '+item3.offsetWidth+' 3Height: '+item3.offsetHeight);
}else if(scrollTop>1400){
console.log('4Width: '+item4.offsetWidth+' 4Height: '+item4.offsetHeight);
}
}
//console.log(scrollTop);
</script>添加回答
举报
0/150
提交
取消