Log in

View Full Version : How do I hide old div when opening a new one?



bate145185
05-19-2011, 07:02 PM
If you go to my site www.bonkage.com notice that if clicking image/video editing doesn't work unless you first click Web site First, and then theres no going back.

So i think I somehow need to make it some click each link closes out all of the others at the same time. It Seemed simple but I was wrong = /


Here is all the code involved. . .


The HTML code for the buttons:

<div id="RightNotes">
<div id="WebDesign" a class="WebDesign" a onclick="document.getElementById('BlogWebDesign').style.display='block'" "document.getElementById('Blog').style.display='close'" ><a>
</div>
<div id="ImageVideoEditing" a class="ImageVideoEditing" a onclick="document.getElementById('BlogImageVideoEditing').style.display='block'"></a>

The CSS code for the buttons:

#WebDesign
{
width: 200px;
height: 92px;
position:relative;
top:-860px;
left:365px;
z-index:6
}

.WebDesign {
display: block;
width: 116px;
height: 92px;
background: url('../images/RightNav/WebDesign.png') top;
text-indent: -99999px;
}
.WebDesign:hover {
background-position: bottom;
}

#ImageVideoEditing
{
width: 200px;
height: 92px;
position:relative;
top:-710px;
left:365px;
z-index:6
}

.ImageVideoEditing {
display: block;
width: 190px;
height: 92px;
background: url('../images/RightNav/ImageVideoEditing.png') top;
text-indent: -99999px;
}
.ImageVideoEditing:hover {
background-position: bottom;
</div>[/HTML]

The HTML code for where the content is loaded:

<div id="BlogWebDesign"><div class="close">
</div>
<div id="BlogImageVideoEditing"><div class="close">
</div>


The CSS code for where the content is loaded:

#BlogWebDesign
{
display: block;
width: 690px;
height: 864px;
background: url('../images/Body/WebServices.png') top;
position:relative;
top:-1945px;
right:113px;
display: none;
.blog display:none;
z-index:3

}


#BlogImageVideoEditing
{
display: block;
width: 690px;
height: 864px;
background: url('../images/Body/ImageVideoEditing.png') top;
position:relative;
display: none;
.blog display:none;
z-index:3

}


Any Advice would be greatly appreciated,



Thanks

Chris