2012-06-24 19 views
1

我有一個div懸停動畫(我使用jquery的.hover()方法)。 div包含一個帶有select的表單。打開選項並懸停在選項上會使IE9將其解釋爲具有「未佔用」父div,導致第二個懸停動畫觸發。你可以在這裏看到:如何使IE9尊重jQuery的懸停()

http://www.oliveboutiquehotelpr.com/temp/

如何避免任何想法?它可以在所有其他主流瀏覽器中正常工作。

比較遺憾的是,這裏有一個的jsfiddle:http://jsfiddle.net/jun6g/1/

+0

請包括您的代碼。我們不應該搜索您的網站來查找您所指的內容。一個[jsfiddle](http://jsfiddle.net/)也會非常有幫助。 –

+5

當我讀到你的問題後,我真的很想告訴你「告訴它的父母」 – vol7ron

+0

,這樣你就知道了:當我點擊第三個下拉列表(夜晚數)時,選項列表顯示的應該是500px以上。 Chrome 19 – Thomas

回答

4

通過添加一個反映選擇焦點的變量並檢查每次它想要動畫時,我已經解決了您的問題。此處的Javascript代碼(JSFiddle
更新
我已經解決了在打開選擇器並在打開關閉選擇器後關閉選擇器時出現問題的問題。代碼和鏈接已更新。

var selectfocused = false; 
    $('#block-block-5').mouseover(function() { 
     selectfocused = false; 
    }); 
    $('#block-block-5 select').focus(function() { 
     selectfocused = true; 
    }).blur(function() { 
     selectfocused = false; 
    }); 
    $('#block-block-5').hover(function() { 
     if (selectfocused == false) { 
      console.log(selectfocused); 
      $(this).stop().animate({ 
       top: 0, 
       opacity: 1 
      }); 
     } 
    }, function() { 
     if (selectfocused == false) { 
      $('#block-block-5 select').blur(); 
      $(this).stop().animate({ 
       top: -294, 
       opacity: 0.6 
      }); 
     } 
    }); 

快樂編碼!

+0

嗨,非常感謝。我注意到,如果我選擇一個選項,當我嘗試更改我的選項時,問題會返回。有什麼想法嗎? – user1477567

+0

沒有問題的幫助。讓我看看我能對你指出的問題做些什麼。 –

+0

我已修復您已注意到的問題。感謝您指出! –

0

沒有此頁面上選擇。無論如何,沒有選擇元素的懸停。