[問題] Jquery 特效問題

看板Ajax作者kerash (Fly機飛阿飛)時間14年前 (2011/08/03 10:12)推噓1(1推 0噓 6→)

留言7則, 2人參與討論串1/1

各位前輩大家好，我是最近在摸jquery的新手目前我遇到一個使用淡入淡出特效的問題 CODE: js部分是 -------------------------------------- <script type="text/javascript"> $(function () { $(".categate").fadeTo("fast",0.7); $(".categate").hover( function() { $(this).fadeTo("fast",1); }, function(){ $(this).fadeTo("fast",0.7); } ); $.each( $(".categate") , function() { var pos = $(this).attr("trpos"); $(this).click(function(){ $(".sub_cate_"+pos).toggle("slow"); }); } ); }); </script> --------------------------------------- html 主要部份 ======================================= <table class="sideBar"> <tr class="categate" trpos="1"><td>123</td></tr> <tr class="sub_cate_1"><td>sub_1-1</td></tr> <tr class="sub_cate_1"><td>sub_1-2</td></tr> <tr class="sub_cate_1"><td>sub_1-3</td></tr> <tr class="categate" trpos="2"><td>123</td></tr> <tr class="sub_cate_2"><td>sub_2-1</td></tr> <tr class="sub_cate_2"><td>sub_2-2</td></tr> <tr class="sub_cate_2"><td>sub_2-3</td></tr> </table> ======================================= 因為想自己寫寫看特效，所以沒特別想用別人寫好的語法可能寫起來不是很好，但是希望指導一下狀況是：在 chrome 下可正常執行，但是每次 toggle 後位置都會往下偏移，到最後可能就跑到很遠的地方了。在 IE 則是正常執行，只是在 toggle 的過程中，sub 的部份會突然拖很長，然後再恢復成原本正常的大小，但至少不會偏移 Firefox 稍微修改後算是最正常的。因為想看變動的狀況，所以有用CSS改變顏色，如果需要的話附在下面: ==================================== <style type="text/css"> .sideBar { width: 150px; } .categate { background-color:#0C0; color:#FFF; width: 150px; display: block;} .sub_cate_1 { background-color:#900; color:#0C6; display: none;} .sub_cate_2 { background-color:#090; color:#C60; display: none;} </style> ==================================== 希望能有比較淺顯的說明讓我了解，非常感謝各位:) UPDATE : 稍微看了一些英文網站介紹是，似乎在 Jquery 對 table 的 tr,td 這些運用特效時會有一些錯誤 .. 如果全部改用 div 會不會大費周章啊 ...? (目前也有測試最基本的 list 方式.. 還在測試 ..) -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 60.250.247.227