J'ai Merci d'avance ... blasteralfred et
. DIV a la largeur 300px. Je veux que la DIV soit de la taille de la largeur de la largeur à 100px lorsque l'utilisateur clique sur déclencheur et que vous voulez de la taille de la taille précédente lorsque l'utilisateur cliquez à nouveau sur la gâchette. Comment puis-je faire cela en utilisant jQuery ??
:)
1 commentaires
5 Réponses :
Vous devez lier un .click () - événement à #Trigger et basculer l'animation.
Quelque chose comme ça devrait à l'astuce.
$('#trigger').bind('click', function() { $('#test').animate({"width": "100px"}, "slow"); })
Cette solution ne fonctionne que pour le 1er clic, puis tous les autres clics après cela ne produira rien de manière visible. De plus, j'aime un peu plus de contrôle sur ma vitesse de la fonction d'animation, donc j'ai tendance à spécifier des millisecondes réelles plutôt que lentement, moyennes ou rapides.
Attribuez une variable de 1 pour clic et 0 pour bloquez puis utilisez la fonction .Cliquez sur la fonction de .Click comme suit:
$("a#trigger").on('click', function(){
$("div#test").toggleClass('small');
});
Ceci est Partie HTML CODE> de cette bascule: <style>
#start{ margin-bottom:60px; display:block; font-size:16px; width:14px; height:79px; position:relative; top:25px; line-height:21px; color:#F0F; background:url(./start1.JPG) left top no-repeat;}
.slide{ background:#98bf21; max-width:500px; width:100; height:100px;position:absolute; left:14px;}
</style>
<script>
$(document).ready(function()
{
function tog()
{
var w = $(".slide").css('width');
if(w=='0px')
{
$(".slide").animate({
width:500
});
}
else
{
$(".slide").animate({
width:0
});
}
}
$("#start").click(function()
{
tog();
});
});
</script>
Pour ceux qui recherchent une version plus courte mais travaillant, vous pouvez le faire: la version la plus courte: p> sur un Fonction: p> usage: p> enfin sur une fonction jquery.fn.extend: p> $('a#trigger').on('click', function(e) {
e.preventDefault();
$("div#test").toggleWidth(300, 100, 150);
});
Vous avez déjà posté cette question ici: Stackoverflow.com/Questions/5583909/...