Domanda

sto cercando di mostrare e nascondere una serie di div utilizzando ginocchiera, slideUp e slideDown. Sono in grado di ottenere il div a slideDown ma non riesco a farlo slideUp. Ho usato questo script senza incidenti prima, quindi sono davvero confusa sul motivo per cui questo non sta funzionando. Ho incluso il mio script e il div sto cercando di mostrare e nascondere.

rapida Nota: Quando ho messo un normale tag vecchia p nel div "veicoli nascosto", ha funzionato bene. Si stava mostrando e nascondendo, come avrebbe dovuto. Tuttavia, quando ho messo la mia tabella di nuovo in quella div, non ha funzionato.

<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>
È stato utile?

Soluzione

Ho postato questo consiglio come un commento, e mi ha aiutato a risolvere il problema in modo sto inviando di nuovo qui:

Quando animazioni slideUp / slideDown funzionano solo in un modo, è spesso un errore di posizionamento. O l'elemento che si sta animando deve essere impostato per position:relative oi figli dell'elemento hanno un float applicato a loro e non stanno dando l'elemento padre vera altezza.

Vorrei provare ad aggiungere float:none al tavolo. Se questo non funziona provare ad aggiungere position:relative al div#HiddenVehicles.

Altri suggerimenti

Per quelli senza problemi galleggiante / posizionamento, ho trovato che l'aggiornamento da jQuery 1.10 a 1.11 risolto il problema.

Autorizzato sotto: CC-BY-SA insieme a attribuzione
Non affiliato a StackOverflow
scroll top