div va glisser, mais il ne sera pas slideUp

Je tente d'afficher et de masquer une série de divs en utilisant toggle, slideUp et slideDown. Je suis capable d'obtenir le div à SlideDown mais je ne peux pas l'obtenir à slideUp. J'ai utilisé ce script sans incident avant donc je suis vraiment confus quant à savoir pourquoi cela ne fonctionne pas. J'ai inclus mon script et le div que je tente de montrer et de cacher.div va glisser, mais il ne sera pas slideUp

Note rapide: Quand j'ai mis une vieille étiquette p régulière dans la div "véhicules cachés", ça a bien fonctionné. C'était montrer et se cacher comme il était censé le faire. Cependant, quand j'ai remis ma table dans cette div, cela n'a pas fonctionné.

<script type="text/javascript"> 
$(document).ready(function() { 
    $(".ShowVehicles").toggle(function() { 
     $(".HiddenVehicles").slideDown(2000); 
     $(this).text("Hide All"); 
    }, function() { 
     $(".HiddenVehicles").slideUp(2000); 
     $(this).text("Show All");     
    }); 
});

<div class="HiddenVehicles" style="display:none; width:730px;"> 
    (there will be a giant table in here) 
    </div>

Source

2009-11-17 RachelGatlin

Je viens de tester votre code localement et cela a bien fonctionné. Très probablement votre table est flottante. Vous pourriez essayer d'ajouter 'position: relative' à votre div et à la table. Toute possibilité que vous pourriez lier à une page de test en direct quelque part? Ce serait plus facile à déboguer. –

Correction, Ce sont deux suggestions sans rapport. Si votre table n'est pas flottante, essayez la position: relative. Si c'est le cas, désactivez-le avec 'float: none' sur la table css. –

Merci beaucoup! Cela a fonctionné parfaitement. Ma table a probablement hérité d'une classe de flotteur de quelque part! Merci encore! – RachelGatlin

J'ai posté ce conseil comme un commentaire, et il a aidé à résoudre le problème, donc je suis annonce à nouveau ici:

Lorsque des animations slideUp/slideDown seulement le travail Dans un sens, c'est souvent un bug de positionnement. Soit l'élément que vous animez doit être défini sur position:relative, soit les enfants de l'élément ont un float appliqué à eux et ne donnent pas la valeur true à l'élément parent. Je voudrais essayer d'ajouter float:none à la table. Si cela ne fonctionne pas, essayez d'ajouter position:relative au div#HiddenVehicles.

Source

2009-11-17 22:02:50

Merci d'avoir attrapé ce @Jason! –

Pour ceux qui n'ont pas de problèmes de flottement/positionnement, j'ai trouvé que la mise à niveau de jQuery 1.10 vers 1.11 a résolu le problème.

Source

2014-08-20 16:10:11 CaitlinW

div va glisser, mais il ne sera pas slideUp

Répondre

Questions connexes