Jump to content

Visibility problems...

maxudaskin

By maxudaskin
in Javascript Help

 Share

Recommended Posts

maxudaskin Advanced Member

maxudaskin

Posted
Posted

How would I go about having a table cell with 4 divs, invisible, and when someone rolls over a menu item, one of them appear. The only thing is, It cannot be invisible to visible... I need it to not take up the space when it is not in visible... any help?

<style type="text/css">
<!--
body {
margin-bottom: 0px;
}
.style1 {color: #FFFFFF}
#human_resources{visibility:hidden;}
#operations{visibility:hidden}
#airline_information{visibility:hidden}
#communications{visibility:hidden}
.style2 {color: #333366; }
-->
</style>

<html><body>
<tr>
    <td width="20%" height="30" align="center" valign="middle" style="background-color:#333355; color:#FFFFFF" onMouseOver="this.style.backgroundColor='#333366';MM_showHideLayers('human_resources','','hide','operations','','hide','airline_information','','hide','communications','','hide')" onMouseOut="this.style.backgroundColor='#333355'" >Home</td>
    <td width="20%" height="30" align="center" valign="middle" bgcolor="#FFFFFF" style="background-color:#333355; color:#FFFFFF" onMouseOver="this.style.backgroundColor='#333366';MM_showHideLayers('human_resources','','show','operations','','hide','airline_information','','hide','communications','','hide')" onMouseOut="this.style.backgroundColor='#333355'">Human Resources</td>
    <td width="20%" height="30" align="center" valign="middle" bgcolor="#FFFFFF" style="background-color:#333355; color:#FFFFFF" onMouseOver="this.style.backgroundColor='#333366'" onMouseOut="this.style.backgroundColor='#333355'"><span class="style1">Operations</span></td>
    <td width="20%" height="30" align="center" valign="middle" bgcolor="#FFFFFF" style="background-color:#333355; color:#FFFFFF" onMouseOver="this.style.backgroundColor='#333366'" onMouseOut="this.style.backgroundColor='#333355'"><span class="style1">Airline Information</span></td>
    <td width="20%" height="30" align="center" valign="middle" bgcolor="#FFFFFF" style="background-color:#333355; color:#FFFFFF" onMouseOver="this.style.backgroundColor='#333366'" onMouseOut="this.style.backgroundColor='#333355'"><span class="style1">Communications</span></td>
  </tr>
  <tr>
    <td height="25%" colspan="5" align="center" valign="top" bgcolor="#FFFFFF"><div class="style2" id="human_resources" onmouseout="MM_showHideLayers('human_resources','','hide')">Job Application | Available Positions | Legal Information</div>
    <div class="style2" id="operations">Login | Hanger | Flight Map | Hubs</div>
    <div class="style2" id="airline_information">Staff | Mission | Statistics | Zoom Airlines</div>
    <div class="style2" id="communications">Teamspeak | Forum | Contact</div><hr /></td>
  </tr></body></html>

Link to comment
Share on other sites
djfox Regular Member

djfox

Posted
Posted

Well, if this is your entire code, I do not see a <table> tag anywhere. You should have something like this:

 

<table border=1 width=100%>
<tr>
    <td width="20%" height="30" align="center" valign="middle" style="background-color:#333355; color:#FFFFFF" onMouseOver="this.style.backgroundColor='#333366';MM_showHideLayers('human_resources','','hide','operations','','hide','airline_information','','hide','communications','','hide')" onMouseOut="this.style.backgroundColor='#333355'" >Home</td>
    <td width="20%" height="30" align="center" valign="middle" bgcolor="#FFFFFF" style="background-color:#333355; color:#FFFFFF" onMouseOver="this.style.backgroundColor='#333366';MM_showHideLayers('human_resources','','show','operations','','hide','airline_information','','hide','communications','','hide')" onMouseOut="this.style.backgroundColor='#333355'">Human Resources</td>
    <td width="20%" height="30" align="center" valign="middle" bgcolor="#FFFFFF" style="background-color:#333355; color:#FFFFFF" onMouseOver="this.style.backgroundColor='#333366'" onMouseOut="this.style.backgroundColor='#333355'"><span class="style1">Operations</span></td>
    <td width="20%" height="30" align="center" valign="middle" bgcolor="#FFFFFF" style="background-color:#333355; color:#FFFFFF" onMouseOver="this.style.backgroundColor='#333366'" onMouseOut="this.style.backgroundColor='#333355'"><span class="style1">Airline Information</span></td>
    <td width="20%" height="30" align="center" valign="middle" bgcolor="#FFFFFF" style="background-color:#333355; color:#FFFFFF" onMouseOver="this.style.backgroundColor='#333366'" onMouseOut="this.style.backgroundColor='#333355'"><span class="style1">Communications</span></td>
  </tr>
  <tr>
    <td height="25%" colspan="5" align="center" valign="top" bgcolor="#FFFFFF"><div class="style2" id="human_resources" onmouseout="MM_showHideLayers('human_resources','','hide')">Job Application | Available Positions | Legal Information</div>
    <div class="style2" id="operations">Login | Hanger | Flight Map | Hubs</div>
    <div class="style2" id="airline_information">Staff | Mission | Statistics | Zoom Airlines</div>
    <div class="style2" id="communications">Teamspeak | Forum | Contact</div><hr /></td>
  </tr>
</table>

 

border is how thick you want it to be, and width is how much of the screen it will take up in length. Those values can be changed to whatever you want.

Link to comment
Share on other sites
This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to topic listing
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.