Go4Expert

Go4Expert (http://www.go4expert.com/)
-   Web Design, HTML And CSS Forums (http://www.go4expert.com/forums/web-design-forum/)
-   -   Smooth scrolling for bottom div required! (http://www.go4expert.com/forums/smooth-scrolling-div-required-t18214/)

akshits 26Jun2009 19:30

Smooth scrolling for bottom div required!
 
Hello,

I want to stick one DIV to the bottom! I've managed to do that but when I scroll down the DIV doesn't scroll smoothly! Below is my code:-



Code:


  <div id="x">
 <center>
  <div id="footer" style="width: 95%; background-color:#66CCFF; border: 1px normal black; top: 100px; position:absolute; align:center; height: 50px" align="center"><center>A</center></div>
 </center>
</div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<script>

window.onscroll = function() {
        document.getElementById("footer").style.display = "none";
        document.getElementById("footer").style.top = (document.body.scrollTop + document.body.clientHeight - 50) + "px";
        document.getElementById("footer").style.display = ""; };

document.onscroll = function() {
        document.getElementById("footer").style.display = "none";
        document.getElementById("footer").style.top = (document.body.scrollTop + document.body.clientHeight - 50) + "px";
        document.getElementById("footer").style.display = ""; };

</script>

 <div id="x"> <center> <div id="footer" style="width: 95%; background-color:#66CCFF; border: 1px normal black; top: 100px; position:absolute; align:center; height: 50px" align="center"><center>A</center></div> </center> </div> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <script> window.onscroll = function() { document.getElementById("footer").style.display = "none"; document.getElementById("footer").style.top = (document.body.scrollTop + document.body.clientHeight - 50) + "px"; document.getElementById("footer").style.display = ""; }; document.onscroll = function() { document.getElementById("footer").style.display = "none"; document.getElementById("footer").style.top = (document.body.scrollTop + document.body.clientHeight - 50) + "px"; document.getElementById("footer").style.display = ""; }; </script>


Check attachment for the code too!

Do NOT wanna use CSS or any other JScript!
Do NOT wanna use "position: fixed; bottom: 0px;" as it doesn't work in IE6, 7, 8[citation needed].

Please help me!

Thanks,
Akshit Soota

Attachment for full code at:

http://www.daniweb.com/forums/attach...3&d=1245592053


All times are GMT +5.5. The time now is 01:40.