jquery - slideToggle không trơn tru

Question

Tôi gặp sự cố với chức năng slideToggle trong jQuery. Nó không trơn chút nào. Bất cứ khi nào tôi nhấp vào nút "Xem thêm", nội dung cần slideToggle, chỉ xuất hiện mà không có tác dụng gì.

Đây là mã HTML:

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

Đây là CSS:

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

} 
.see_more_content{ 
    text-align:center; 
} 

Và cuối cùng, javascript:

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

Tôi đã đọc bài viết "Animation Jump - mẹo nhanh ", nhưng tôi không nghĩ đó là vấn đề ở đây. Vì tôi chưa chỉ định bất kỳ margin hoặc padding nào với nội dung cần slideToggle.

Cảm ơn trước sự giúp đỡ của bạn.

Answer 1

Hàng của bảng dường như không trượt. Bạn nên cố gắng tìm cách giải quyết bằng cách sử dụng DIV. Chúng trượt và hoạt hình tốt hơn nhiều. Bạn cũng có thể bọc nội dung vào một div, và trượt đó? Có lẽ điều đó sẽ đẩy hàng bảng để bắt chước một slide.

Answer 2

Bạn đang chạy một slideToggle trên hàng của bảng. Các hàng của bảng không chơi tốt với một số css. Điều này có nghĩa trong một số trường hợp, nó sẽ không trượt, nhưng chỉ hiển thị khi nó cuối cùng có thể nhìn thấy được.