Jquery slide left right with button

Je crée une simple diapositive jquery. Lorsque l'utilisateur clique sur le bouton 1 boîte div affichera le formulaire à droite et l'un masquera le formulaire à gauche. Voici mon code, mais dans ce cas, quand je clique sur le bouton, tous les déplacements de la div de droite à gauche, mais aucun d'entre eux ne se cache à gauche.Jquery slide left right with button

<!DOCTYPE html> 
<html> 
<head> 
    <title></title> 

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
    <style> 
    .row{ 
     max-height: 40px; 
     overflow: hidden; 
     background-color: pink; 
    } 
    .col-md-4{ 
     border: 10px solid #eee; 
    } 
    </style> 

</head> 
<body> 


<div class="container"> 
<div class="row"> 
    <div class="col-md-4">gh</div> 
    <div class="col-md-4">gh</div> 
    <div class="col-md-4">gh</div> 
    <div class="col-md-4">gh</div> 
    <div class="col-md-4">gh</div> 
    <div class="col-md-4">gh</div> 
</div> 

<button>Click</button> 
</div> 



<script type="text/javascript"> 
    $('button').click(function(){ 
    $(".col-md-4").next().animate({width:'toggle'},2000); 
}); 
</script> 


</body> 
</html>

Source

2015-07-27 ProjectAb

J'espère que c'est ce que vous aviez l'intention (et non quelque chose que je mal compris)

Fondamentalement, le violon suivant fait que le glissement div montré disapear vers la gauche lorsque vous cliquez sur le button et le suivant apparaît de la droite.

Fiddle

Cordialement

Source

2015-07-27 13:21:52 Aymeric

homme Merci. Je corrige déjà le problème mais j'accepte aussi tes ans. – ProjectAb

Jquery slide left right with button

Répondre

Questions connexes