[job0107]

Ok Here's the <div> that displays the pages.

Code:

<div id="window_div" style="text-align:center;position:absolute;left:125px;top:219px;width:750px;height:438px;background-color:#ffffe0;border-left:double 4 #000000;border-right:double 4 #000000;overflow:auto;padding-left:16px;padding-right:16px;">
<div id="page0" style="visibility:visible;display:'';"><font style="position:relative;top:50px;font-size:36;">Welcome aboard</font></div>
<div id="page1" style="visibility:hidden;display:none;"><?php require("new1.php"); ?></div>
<div id="page2" style="visibility:hidden;display:none;"><?php require("new4.php"); ?></div>
</div>

As you can see page0 is displayed as defualt. Then with javascript I change the visibility and display properties of the other pages which are both larger than the <div>s' window. When I have page1 or page2 displayed and I scroll the page in the <div> and then toggle the other page to be displayed(page1 or page2) then the scrolled position stays the same. I doesn't reset to the top of the page like I want it to.