problema codigo para ocultar div

[wolflone1983]

Hola mi problema es que tengo un div cmenu que contiene un div menuoculto, otro div menuoculto2 y otro div menu,lo quiero es que al inicir la web solo se vea el div menuoculto pegado al margen izquierda al pinclarle se desplace cmenu a la derecha quedando visible y al dar a menuoculto2 cmenu vuelva a la posicion original

pongo el codigo

en el html:

Código HTML:

dentro de head
<script type="text/javascript" src="../js/jquery-1.9.1.js"></script>
<script type="text/javascript" src="../js/menu.js"></script>
<div id="conmenu" class="cmenu">
<a id="abrir" href="javascript:;" class="menuoculto"></a>
<a id="cerrar" href="javascript:;"  class="menuoculto2" style="display:none;"></a>
<div class="menu"></div>
</div>
 

en en css:

Código CSS:

.cmenu
{
    height: 300px;
    width: 155px;
    position: absolute;
    top: 171px;
    bottom: 40px;
    left: -3px;
}
.menuoculto
{
    height: 82px;
    width: 28px;
    background-image: url(../imagenes/Menutrasparanteoculto.png);
    background-repeat: no-repeat;
    cursor: pointer;
    position: absolute;
    left: 117px;
    top: 21px;
}
.menuoculto2
{
    height: 82px;
    width: 28px;
    background-image: url(../imagenes/Menutrasparanteoculto.png);
    background-repeat: no-repeat;
    cursor: pointer;
    position: absolute;
    left: 117px;
    top: 21px;
}
.menu
{
    height: 300px;
    width: 127px;
    top: 0px;
    bottom: 40px;
    background-image: url(../imagenes/Menutrasparante.png);
    background-repeat: no-repeat;
    left: 2px;
    position: absolute;
    
}
 

Código Javascript:

y en el archivo menu.js con jquery:
jQuery('#abrir').click(function() {
    jQuery('#conmenu').animate({ 'marginLeft' : "-=85px" });
    document.getElementById('cerrar').style.display='block';
    document.getElementById('abrir').style.display='none';
});     
jQuery('#cerrar').click(function() {
    jQuery('#conmenu').animate({ 'marginLeft' : "+=85px" });
    document.getElementById('abrir').style.display='none';
    document.getElementById('cerrar').style.display='block';
});
 

por mas que lo intento no consigo que funcione haber sime podeis hechar una mano

[wolflone1983]

lo he conseguido solucionar pongo codigo por si le sirve ah alguien
html:

Código HTML:

<div id="conmenu" class="cmenu">
<div id="cerrar" class="menuvisible"></div>
<div id="abrir" class="menuoculto"></div>
<div class="menu"></div>
</div>
 

css:

Código CSS:

.cmenu
{
    height: 300px;
    width: 155px;
    position: absolute;
    top: 178px;
    bottom: 40px;
    left: -124px;
}
.menuoculto
{
    height: 82px;
    width: 28px;
    background-image: url(../imagenes/Menutrasparanteoculto.png);
    background-repeat: no-repeat;
    cursor: pointer;
    position: absolute;
    left: 117px;
    top: 21px;
    display:block;  
}
.menuvisible
{
    height: 82px;
    width: 28px;
    background-image: url(../imagenes/Menutrasparanteoculto.png);
    background-repeat: no-repeat;
    cursor: pointer;
    position: absolute;
    left: 117px;
    top: 21px;
    display:none;
 
}
.menu
{
    height: 300px;
    width: 127px;
    top: 1px;
    bottom: 40px;
    background-image: url(../imagenes/Menutrasparante.png);
    background-repeat: no-repeat;
    left: 0px;
    position: absolute;
    
}
 

jquery:
$(document).ready(function ()
{


$('#abrir').click(function()
{
$(".cmenu").animate({"left": "-124px"}, "slow");
},
function()
{
$(".cmenu").animate({"left": "0px"}, "slow"),
$('#abrir').css('display','none'),
$('#cerrar').css('display','block');
},
$('#cerrar').click(function()
{
$(".cmenu").animate({"left": "-124px"}, "slow"),
$('#cerrar').css('display','none'),
$('#abrir').css('display','block');
}
)
);

});