javascript - Expanding a div's height when page scrolls down -
i'm looking way dynamically change div's height when page scrolls. because have fixed panel on right side of screen, , menu banner @ top.
when @ top of page, top of side panel touches bottom of banner @ top. thing is, when page scrolled down , banner leaves screen, leaves gap size of top banner between top of screen , top of side panel. i'd put div between them grow in height when page scrolled down. there way in css or js ?
i can't have side panel have 100% height because hide elements on top banner, on lower resolution screens.
i added ugly images made on paint explain :
this css side panel :
position: fixed; right: 0; top: 180px; height:calc(100% - 180px);
hello not understand banner situation.. regarding need, can call js function whenever scroll:
<body> <div class="content" onscroll="dynamicheight()"> </div> <script> function dynamicheight() { var content = document.getelementbyid("content"); var y = content.scrolltop; document.getelementbyid('random').style.height = y; } </script>
this way div id random grow according how scroll. have adjust wishes. hope guide bit.
Comments
Post a Comment