I'm trying to collapse my header for smaller monitors and have a cookie set so it remembers the open or closed state like VB does in its collapse buttons. It doesn't seem to work. Can anyone help me get this so it remembers the cookie?
Code:
<div id="vb4_container">
<div id="vb4" style="width:920px"><a id="vb4_link" href="http://www.domain.org/"></a>
<div id="vb4_content">
<p>Our club was started as a way for ...</p>
<ul>
<li><a href="http://www.domain.org/register.php">Click Here to learn MORE!</a></li>
</ul>
</div>
</div>
<a id="vb4_close" href="#" onclick="
var v_vob = fetch_object('vb4_container');
if(v_vob)
{
set_cookie('vb4banner_off', v_vob.className ? '' : 1);
v_vob.className = v_vob.className ? '' : 'promo_closed';
}
return false;
"></a>
</div>
CSS CODE
Code:
/* vB4 Promo */
#vb4_container {
background-color:#2d2d2d;
/*margin: 0 -35px 10px;*/
margin: 0;
padding:10px 0 0 0;
position:relative;
}
#vb4 {
margin: auto;
background: transparent url(http://www.domain.org/images/minimized/vb4_promo_bg.jpg) no-repeat 0 0;
height:176px;
position:relative;
}
.promo_closed #vb4 {
margin: auto;
background: transparent url(http://www.domain.org/images/minimized/vb4_promo_bg.jpg) no-repeat 0 -78px;
height:176px;
position:relative;
}
#vb4_link {
position:absolute;
top:0;
left:0;
width:580px;
height:132px;
outline: none;
}
#vb4_content {
position:absolute;
right:0;
top:0;
width:324px;
background: transparent url(http://www.domain.org/images/minimized/vb4_promo_title.png) no-repeat -2px 5px;
min-height: 64px;
}
#vb4_content p {
font-family:verdana,geneva,lucida,'lucida grande',arial,helvetica,sans-serif;
margin-top:46px;
margin-bottom:26px;
color:#FFF;
font-size:11px;
}
#vb4_content ul {
margin:0px;
padding:0;
position:absolute;
bottom:0;
}
#vb4_content li {
list-style-type:none;
display:inline;
margin-right:10px;
}
#vb4_content li a {
color:#dd0000;
font-family:helvetica,sans-serif;
font-weight:bold;
font-size:14px;
text-decoration:none;
outline: none;
}
#vb4_close {
position:absolute;
bottom:0;
right:0;
background: transparent url(http://www.domain.org/images/minimized/vb4_promo_minimize.png) no-repeat 0 0;
width: 28px;
height: 27px;
outline: none;
}
.promo_closed #vb4_content p {
display:none;
}
.promo_closed #vb4 {
height:116px;
}
.promo_closed #vb4_content {
top:52px;
bottom:16px;
}
#vb4_container.promo_closed {
margin-top: -64px;
}
.promo_closed #vb4_close {
background: transparent url(http://www.domain.org/images/minimized/vb4_promo_maximize.png);
outline: none;
}
/* End vB4 Promo */