jquery - slideToggle चिकनी नहीं

Question

मुझे slideToggle फ़ंक्शन jQuery में कोई समस्या है। यह बिल्कुल आसान नहीं है। जब भी मैं "अधिक देखें" बटन पर क्लिक करता हूं, तो सामग्री जो slideToggle होनी चाहिए, बस इतना प्रभाव के साथ बाहर निकलती है।

.third{ 
    text-align:right; 
    padding-right:10px; 
} 
.see_more{ 
    display:none; 

} 
.see_more_content{ 
    text-align:center; 
} 

और अंत में, जावास्क्रिप्ट:

<td class="third"> 
    <a href="javascript:void(0)" class="btn btn-primary upgrade1">See More</a> 
</td>       

<tr class="see_more" id="see_more"> 
     <td colspan="3" class="see_more_content">Hello! How are you doing</td> 
</tr> 

यह सीएसएस है:

यह एचटीएमएल कोड है

<script type="text/javascript"> 
      $(document).ready(function(){ 
       $(".upgrade1").click(function() { 
        $("#see_more").slideToggle("slow"); 
        }); 
       }); 
    </script> 

मैं लेख "एनीमेशन कूद पढ़ा है - त्वरित टिप ", लेकिन मुझे नहीं लगता कि यह समस्या है। चूंकि मैंने slideToggle की सामग्री के लिए margin या padding निर्दिष्ट नहीं किया है।

आपकी मदद के लिए अग्रिम धन्यवाद।

Answer 1

तालिका पंक्तियां स्लाइड लगती नहीं हैं। आपको इसके बजाय DIV का उपयोग करके एक समाधान खोजने की कोशिश करनी चाहिए। वे बहुत बेहतर स्लाइड और एनिमेट। आप सामग्री को एक div में भी लपेट सकते हैं, और उसे स्लाइड कर सकते हैं? हो सकता है कि एक स्लाइड की नकल करने के लिए तालिका पंक्ति को धक्का दे।

Answer 2

आप एक तालिका पंक्ति पर slideToggle चला रहे हैं। टेबल पंक्तियां कुछ सीएसएस के साथ अच्छी नहीं खेलती हैं। इसका मतलब है कि कुछ मामलों में, यह स्लाइड नहीं करेगा, लेकिन अंततः दिखाई देने पर दिखाएं।