espace vertical div

Question

je deux DIV

un à droite l'autre sur le côté gauche

Je cherche un code qui me donne le lien et en cliquant sur ce lien les deux divs élargiront à 100% (cela signifie que l'un d'entre eux glisser vers le bas) et en cliquant à nouveau, ils retourneront à être côte à côte

J'ai essayé ceci:

<style> 
#container { 
    width:100%; 
    height:500px; 

} 
#left { 

    width:45%; 
    height:500px; 
    float: left; 
} 
#right { 

    width:45%; 
    height:500px; 
    float: left; 
} 
</style> 

<script type="text/javascript" src="scripts/jquery-1.8.0.min.js"></script> 


<div id="container"> 
     <div id="left"> 
     LEFT 
    </div> 

     <div id="right"> 
     RIGHT 
    </div> 
</div> 

<script> 
$('#container').click(function(){ 
     if (parseInt($('div#right').css('right'),10) < 0) { 
       // Bring right-column back onto display 
        $('div#right').animate({ 
         right:'0%' 
        }, 1000); 

        $('div#left').animate({ 
        width:'45%' 
        }, 600); 
       } else { 

     // Animate column off display. 
        $('div#right').animate({ 
         right:'-45%' 
        }, 600); 

        $('div#left').animate({ 
        width:'100%' 
        }, 1000); 
     } 

}); 
</script> 

Answer 1

Vous pouvez utiliser bascule jQuery, pour votre puspose .

Jetez un oeil à ce Example