SOLVED(Thanks obsidian)Not working, (invisible)

[Ninjakreborn]

I can't believe this, 3 wasted hours, on javascript again.
It's not working, all I want to do is make a div go invisible onload.
document.onLoad.getElementById("propertysubmenu").style.visibility.hidden;
I have tried that, and everything, I tried
document.getElementById("propertysubmenu").style.visibility = "hidden";
= "hide" document.onLoad with the rest, I have tried everything, triple and quadruple checked my syntax, triying to make absolutely sure, this is the same syntax, I found on ton's of site's, adn the same syntax I used before, what's going on.

I am trying to make a drop down menu, simply make it disappear onload, and make it reappear on, on mouse over, but nothign is working, I really don't get it, any advice.
I know the id is there, it's right here.

[code]<table class="menu_table">
<tr>
<td class="menu_cell"><a href="whois.php"><img src="images/menu/1_whoisOHB.gif" class="noborder" alt="Who is Oakley Home Builders?" /></a></td>
<td class="menu_cell"><a href="design.php"><img src="images/menu/2_design.gif" class="noborder" alt="Design Your Dream Home" /></a></td>
<td class="menu_cell"><a href="homes_for_sale.php"><img src="images/menu/3_homes-for-sale.gif" class="noborder" alt="Homes for Sale - Chicago Suburbs" /></a></td>
<td class="menu_cell"><a href="portfolio.php"><img src="images/menu/4_portfolio.gif" class="noborder" alt="Portfolio of Homes - Westmont, Downers Grove" /></a></td>
<td class="menu_cell"><a href="testimonials.php"><img src="images/menu/5_customers.gif" class="noborder" alt="Customer Testimonials" /></a></td>
<td class="menu_cell"><a href="newsletter.php"><img src="images/menu/6_newsletter.gif" class="noborder" alt="Oakley Home Builders Newsletter" /></a></td>
<td width="3px"></td>
<td class="menu_cell"><a href="contact.php"><img src="images/menu/7_contact.gif" class="noborder" alt="Contact Oakley Home Builders" /></a></td>
</tr>
<tr>
<td class="menu_cell"></td>
<td class="menu_cell"></td>
<td class="menu_cell"></td>
<td class="menu_cell">
<div id="propertysubmenu">
<a href="temp">Temp</a>
<a href="temp2">Temp 2</a>
</div>
</td>
<td class="menu_cell"></td>
<td class="menu_cell"></td>
<td width="3px"></td>
<td class="menu_cell"></td>
</tr>

</table> [/code]
It was someone elses menu that is why it's in tables, but I have the div there, it should disappear, I really don't understand it, any advice would be greatly appreciated, I needed to finish this before he started to work on the site, which is 30 minutes, I don't understand why it's not working.

[obsidian]

One of the easiest ways to hide a div is something like this:
[code]
window.onload = function() {
  x = document.getElementById('propertysubmenu');
  x.style.display = 'none';
  x.style.position = 'absolute';
  x.style.left = '-9999px';
}
[/code]

This does two things: first, it sets your display attribute to "none" (pretty self explanatory). Then, it actually sets your position to absolute and pulls the dive all the way off the left hand side of the screen. Try this out and see where it gets you.

[Ninjakreborn]

Thanks, I just got the thing working, but there is a severe problem.

Here is what I have.

[code]<table class="menu_table">
<tr>
<td class="menu_cell"><a href="whois.php"><img src="images/menu/1_whoisOHB.gif" class="noborder" alt="Who is Oakley Home Builders?" /></a></td>
<td class="menu_cell"><a href="design.php"><img src="images/menu/2_design.gif" class="noborder" alt="Design Your Dream Home" /></a></td>
<td class="menu_cell"><a href="homes_for_sale.php"><img src="images/menu/3_homes-for-sale.gif" class="noborder" alt="Homes for Sale - Chicago Suburbs" /></a></td>
<td class="menu_cell"><a href="portfolio.php" onmouseover="document.getElementById('propertysubmenu').style.display='block';" onmouseout="document.getElementById('propertysubmenu').style.display='none';"><img src="images/menu/4_portfolio.gif" class="noborder" alt="Portfolio of Homes - Westmont, Downers Grove" /></a></td>
<td class="menu_cell"><a href="testimonials.php"><img src="images/menu/5_customers.gif" class="noborder" alt="Customer Testimonials" /></a></td>
<td class="menu_cell"><a href="newsletter.php"><img src="images/menu/6_newsletter.gif" class="noborder" alt="Oakley Home Builders Newsletter" /></a></td>
<td width="3px"></td>
<td class="menu_cell"><a href="contact.php"><img src="images/menu/7_contact.gif" class="noborder" alt="Contact Oakley Home Builders" /></a></td>
</tr>
<tr>
<td class="menu_cell"></td>
<td class="menu_cell"></td>
<td class="menu_cell"></td>
<td class="menu_cell">
<div id="propertysubmenu">
<?php
$selecttemp = "SELECT * FROM oak_properties";
$querytemp = mysql_query($selecttemp);
while ($rowtemp = mysql_fetch_array($querytemp)) {
echo "<a href=\"property.php?pid={$rowtemp[propertynumber]}\">{$rowtemp[address1]}</a><br />\n";
}
?>
</div>
</td>
<td class="menu_cell"></td>
<td class="menu_cell"></td>
<td width="3px"></td>
<td class="menu_cell"></td>
</tr>

</table> [/code]

[code]<body class="normal" onload="document.getElementById('propertysubmenu').style.display='none';">[/code]
The body code makes it hide at load, and the upper one does the hide and display, however there is a problem.

http://www.s162063332.onlinehome.us/oakley/property.php?pid=3

Here you will see, unfortunately, it doesn't work right, can you help me figure out how to get it to work right, it makes it to where you can't go downwards to select the other links, it "looks" shitty, because he is going back to style it later, but I just needed a skeleton now, but it's not even functional, that part works, but you can't even go down to a link and click it easily, you have to play with it a few minutes before it let's you click one, instead of working like some of the other's work.
Any advice on how I can get it working would be greatly appreciated.

[obsidian]

Most likely, it's doing that because you have no style on it. You need to stylize the menu items (actually the anchor tags) to be display: block and have no space between them. What is happening is that as soon as you mouseout of the individual elements, it's calling your "hide" function. Without having a defined space for your links, this will keep happening.

[Ninjakreborn]

Can you give me an example, when I do it with css it just messes it up, when it does it in javascript, it doens't seem to work, I don't know what to do, it took me 3 hours just to create this, I have javascript, any advice?

[Ninjakreborn]

Thanks obsidian, I just threw the onmouseout, on each and every dynamic link and it worked perfectly, because some of this pages loads slowly, it didn't work the way it should 100% but well enough for him to style it, thanks.