How to make an element visible after went to it's position : I want to make an object is visible when user goes to it's location.(It's a HTML document.) Here's the example code.

    <HTML>
    <BODY>
    <div id="top">
    <P>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
    </P>
    <div id="bottom" style="visibility: hidden;">
    <P>Lorem ipsum dolor sit amet, consectetur adipiscing elit.
    </P>
    </div>
    </BODY>
    </HTML>

When user scrolled to bottom (Or typed 'pagename.html#bottom' on URL bar) bottom <div> should be visible. How to write a code for this? (Accept html,css and javascript)