IE8中的jQuery SlideDown沒有按下下一個元素

Question

有一個div，並且在它之後是ul。

我申請slideDown到div，並且推動ul下很好地在所有瀏覽器除了IE8，其中div覆蓋ul。

當我申請slideUp到div，然後的ul向下滑動 - 離開它和前元素之間有很大的差距。

有沒有人遇到過這種行爲？什麼可能導致它？

你可以看到一個例子here：

的slideDown和slideUp被激活，當您點擊此圖片：

它使這個div出現或消失：

這是ul，當div出現並消失時，應該是down and up，分別爲：

這裏是代碼。該HTML：

<div class="clearfix" id="whatWhere"> 
<ul> 
<!--what--> 
    <li id="what"> 
     <span>מה</span> 
     <div class="list"> 
      <ul class=""> 
       <li class="orange"><a href="http://dev.linux.ort.org.il/colleges?cat=7">אדריכלות ועיצוב פנים</a></li> 
       <li class="gray"><a href="http://dev.linux.ort.org.il/colleges?cat=14">אלקטרוניקה</a></li> 
       </ul>  
      <div class="toClose"> 
      <img width="37" height="18" src="http://dev.linux.ort.org.il/colleges/wp-content/themes/twentyeleven/images/close.png"> 
      </div> 
      </div><!--end list--> 
    </li> 
<!-- where --> 
    <li id="where"> 
      <span>איפה</span> 
      <div class="list"> 
      <ul class=""> 
       <li class="orange"><a href="http://dev.linux.ort.org.il/colleges/?p=21">מכללת אורט כפר סבא</a></li> 
       <li class="gray"><a href="http://dev.linux.ort.org.il/colleges/?p=19">מכללת אורט קרית ביאליק</a></li> 
      </ul> 

       <div class="toClose"> 
      <img width="37" height="18" src="http://dev.linux.ort.org.il/colleges/wp-content/themes/twentyeleven/images/close.png"> 
      </div> 
       </div><!--end list--> 
    </li> 
    </ul> 
</div> 

<ul id="links"> 
    <li id="hashlama"><a href="http://dev.linux.ort.org.il/colleges/?p=161">השלמה לתואר ראשון להנדסאים</a></li> 
    <li id="michlalot"><a href="http://dev.linux.ort.org.il/colleges/?p=165">מכללות אקדמיות להנדסה</a></li> 
</ul> 

這是JavaScript：

    $(document).ready(function() { 
        $("#whatWhere ul li span").click(function() { 
         //if another li open- closed; 
        if($(this).parent().siblings().children(".list").hasClass("highlight")){ 
         // $(this).parent().siblings().children("ul").slideUp("slow"); 
         $(this).parent().siblings().children(".list").css("display","none"); 
         $(this).parent().siblings().removeClass("open"); 
         $(this).parent().siblings().addClass("standBy"); 
         $(this).parent().siblings().children(".list").toggleClass("highlight"); 
        } 
        //open ul of selected li area 
        $(this).next().toggleClass("highlight"); 
        if($(this).next().hasClass("highlight")) 
         { 
         //#whatWhere 
          $(this).parent().parent().parent().addClass("open"); 
          //li 
          $(this).parent().addClass("open"); 
          $(this).next().slideDown("slow"); 
          $(this).parent().siblings().addClass("standBy"); 
          $(this).parent().removeClass("standBy"); 
         } 
        else 
         { 
         $(this).parent().parent().parent().removeClass("open"); 
         //li 
          $(this).parent().removeClass("open"); 
         $(this).next().slideUp("slow"); 
         // $(this).next().css("display","none"); 
         $(this).parent().siblings().removeClass("standBy"); 
         $(this).parent().removeClass("standBy"); 
         } 
        }); 

        $("#whatWhere ul li .list div.toClose").click(function() { 
         $(this).parent().parent().parent().parent().removeClass("open"); /*div #whatWhere*/ 
          $(this).parent().parent().removeClass("open"); /*li #what/#where*/ 
         $(this).parent().slideUp("slow"); 

         $(this).parent().parent().siblings().removeClass("standBy");/* the other li #what/#where*/ 
          $(this).parent().toggleClass("highlight"); /* div .list - maybe not needed*/ 
        }); 
       }); 

（我問了一個question about the same code前一陣子（並獲得了很好的答案），但問題是在Chrome，和有問題行爲是不同的）

Answer 1

我最終重寫了HTML，所以帶有class =「list」的div在li之外，其id爲「when」和「where」。我當然也改變了JavaScript，以適應這種變化，並且解決了問題

Answer 2

我也有類似的問題，這個問題似乎與到圓形邊角的使用

behavior: url(border-radius.htc); 

我瘋狂的猜測是任何CSS的行爲指令都會造成麻煩。