div wird slideDown, aber es wird nicht slideUp

Ich versuche, eine Reihe von divs mit toggle, slideUp und slideDown anzuzeigen und auszublenden. Ich bin in der Lage, das div zu slideDown zu bekommen, aber ich kann es nicht zu slideUp bringen. Ich habe dieses Skript ohne Vorfall verwendet, daher bin ich wirklich verwirrt, warum das nicht funktioniert. Ich habe mein Skript und das Div, das ich zu zeigen und zu verstecken versuche, eingefügt.div wird slideDown, aber es wird nicht slideUp

Quick Hinweis: Wenn ich ein reguläres altes P-Tag in das "versteckte Fahrzeuge" div legte, funktionierte es gut. Es zeigte und versteckte sich wie es sollte. Als ich meinen Tisch wieder in dieses div stellte, funktionierte das nicht.

<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>

Quelle

2009-11-17 RachelGatlin

Ich habe gerade Ihren Code lokal getestet und es hat gut funktioniert. Höchstwahrscheinlich ist Ihre Tabelle floated. Du könntest versuchen, 'position: relative' zu deinem div und zur Tabelle hinzuzufügen. Irgendeine Möglichkeit, die Sie irgendwo mit einer Live-Testseite verlinken könnten? Es wäre einfacher zu debuggen. –

Korrektur, das waren zwei voneinander unabhängige Vorschläge. Wenn Ihre Tabelle nicht schwebt, versuchen Sie die Position: relativ. Wenn dies der Fall ist, schalten Sie es mit 'float: none' auf dem Tisch css aus. –

Vielen Dank! Das hat perfekt funktioniert. Meine Tabelle erbte höchstwahrscheinlich eine Float-Klasse von irgendwo! Danke noch einmal! – RachelGatlin

posted ich diesen Rat als Kommentar, und es half, das Problem zu beheben, so bin ich es wieder hier veröffentlichen:

Wenn slideUp/slidedown Animationen nur Arbeit Ein Weg, es ist oft ein Positionierungsfehler. Entweder muss das Element, das Sie animieren möchten, auf position:relative festgelegt werden, oder die untergeordneten Elemente des Elements werden mit float verknüpft und geben dem übergeordneten Element nicht die wahre Höhe.

Ich würde versuchen, float:none in die Tabelle hinzuzufügen. Wenn das nicht funktioniert, versuchen Sie position:relative zu div#HiddenVehicles hinzuzufügen.

Quelle

2009-11-17 22:02:50

Danke, dass du @Jason! –

Für diejenigen ohne Float/Positionierung Probleme, fand ich, dass ein Upgrade von jQuery 1.10 auf 1.11 das Problem gelöst.

Quelle

2014-08-20 16:10:11 CaitlinW

div wird slideDown, aber es wird nicht slideUp

Antwort

Verwandte Themen