2009-11-17 18 views
5

मैं टॉगल, स्लाइडअप और स्लाइडडाउन का उपयोग करके divs की एक श्रृंखला को दिखाने और छिपाने का प्रयास कर रहा हूं। मैं divDown को div प्राप्त करने में सक्षम हूं लेकिन मैं इसे स्लाइडअप पर नहीं ले सकता। मैंने पहले इस घटना के बिना इस स्क्रिप्ट का उपयोग किया है, इसलिए मैं वास्तव में उलझन में हूं कि यह क्यों काम नहीं कर रहा है। मैंने अपनी स्क्रिप्ट और div को शामिल किया है जिसे मैं दिखाने और छिपाने का प्रयास कर रहा हूं।div स्लाइड डाउन हो जाएगा लेकिन यह स्लाइड नहीं करेगा

त्वरित नोट: जब मैंने "छिपा वाहन" div में नियमित रूप से पुराना पी टैग लगाया, तो यह ठीक काम करता था। यह दिखा रहा था और छुपा रहा था जैसा कि यह माना जाता था। हालांकि, जब मैंने अपनी मेज को उस div में वापस रखा, तो यह काम नहीं किया।

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

मैंने अभी स्थानीय रूप से आपके कोड का परीक्षण किया और यह ठीक काम किया। सबसे अधिक संभावना है कि आपकी मेज तैरती है। आप अपने div और तालिका में 'स्थिति: सापेक्ष' जोड़ने का प्रयास कर सकते हैं। कोई भी संभावना है कि आप कहीं भी लाइव टेस्ट पेज से लिंक कर सकते हैं? डीबग करना आसान होगा। –

+2

सुधार, वे दो असंबंधित सुझाव थे। यदि आपकी तालिका फ़्लोट नहीं है, तो स्थिति का प्रयास करें: रिश्तेदार। यदि ऐसा है, तो इसे तालिका सीएसएस पर 'फ्लोट: कोई नहीं' के साथ बंद करें। –

+1

आपको बहुत बहुत धन्यवाद! यह पूरी तरह से काम किया। मेरी मेज कहीं से कहीं एक फ्लोट वर्ग विरासत में मिला था! एक बार फिर धन्यवाद! – RachelGatlin

उत्तर

3

मैं एक टिप्पणी के रूप में इस सलाह तैनात है, और यह समस्या को ठीक करने तो मैं इसे फिर से यहाँ पोस्ट कर रहा हूँ मदद की:

जब slideUp/slideDown एनिमेशन केवल काम एक तरफ, यह अक्सर एक स्थिति बग है। या तो जिस तत्व को आप एनिमेट कर रहे हैं उसे position:relative पर सेट किया जाना चाहिए या तत्व के बच्चों को float उनके लिए लागू किया गया है और मूल तत्व को वास्तविक ऊंचाई नहीं दे रहे हैं।

मैं तालिका में float:none जोड़ने का प्रयास करूंगा। यदि यह काम नहीं करता है तो div#HiddenVehicles पर position:relative जोड़ने का प्रयास करें।

+0

@ जेसन को पकड़ने के लिए धन्यवाद! –

0

फ्लोट/पोजीशनिंग समस्याओं के बिना उन लोगों के लिए, मैंने पाया कि jQuery 1.10 से 1.11 तक अपग्रेड करने से समस्या हल हो गई है।

संबंधित मुद्दे