的WebKit點擊的mouseenter /懸停事件

我來到這裏提琴：http://jsfiddle.net/fjjr6sq2/1/這是非常簡單的功能的WebKit點擊的mouseenter /懸停事件

$(".dropdown li").on("mouseenter", function(){ 
    $(this).find(".layer").addClass("active"); 
}).on("mouseleave", function(){ 
    $(this).find(".layer").removeClass("active"); 
});

其顯示和隱藏，當你的mouseenter /鼠標離開特定列表項的層。如果使用懸停功能交換mouseenter/mouseleave，結果同樣如此。

此問題僅存在於webkit瀏覽器，所以如果您想正確複製，請使用Chrome。

問題：

當我選擇選項3或4選擇列表，則層突然顯示，當然它不應該。當我將鼠標懸停在特定的列表項目上時，圖層只應顯示自己（獲得/放鬆活動類）。

我無法做出任何解決方法，我很好奇它的CSS部分是否有問題（也許我缺少一個或兩個規則），或者它可能是一個webkit的錯誤。我搜索谷歌，但沒有任何成功縮小這種行爲的原因。

不幸的是，我不能使用自定義選擇插件，大概會解決問題。

請指教。

更新

我不能錄製的行爲，所以我想圖像將是這種情況下sufficent。

當我打開選擇列表，然後選擇選項4時，圖層會自動打開，因爲我會點擊與光標垂直的項目。因此，將光標下方3項打開選擇列表將在這裏打開層對項目3

檢查圖像之後：

https://imageshack.com/a/ZnKz/1

紅點代表，我點擊了點。

我的Chrome版本爲：38.0.2125.111米

來源

2014-10-28 user3763270

我不能只是通過選擇3或4。我沒有重現此注意如果你選擇一個高數字（比如10），然後選擇一個高於它的數字（比如8或9），當選擇列表關閉時，你的鼠標會留在一個li盒子上，這當然會出現一個圖層。這在Firefox中不會發生，因爲選擇列表總是關閉。這是你正在努力的行爲？ – cjspurgeon 2014-10-28 17:18:35

@cjspurg我已經更新了一些額外的輸入和圖像，希望能夠更好地理解問題。 – user3763270 2014-10-29 08:39:29

我可以在PC上使用Chrome進行重新編輯，Mac上的Chrome不會執行此操作。到目前爲止，我能得到的最接近的答案是在'.layer'類中添加'pointer-events：none'，但它仍然閃爍。不知何故，在選擇一個選項後，鼠標暫時停留在圖層上。我認爲這是一個Chrome錯誤。 – cjspurgeon 2014-10-31 18:21:50

我找到了一個解決方法通過設置CSS屬性1秒

$("select").click(function() { 
    $('.layer').css('pointer-events', 'none'); 
    window.setTimeout(showpointer, 1000); 
}); 

function showpointer(){ 
    $('.layer').css('pointer-events', 'auto'); 
}

來源

2015-02-05 09:56:32 jarreweb

如果您有新問題，請點擊[問問題]（http://stackoverflow.com/questions/ask）按鈕。如果有助於提供上下文，請包含此問題的鏈接。 – 2015-02-05 10:17:42

的WebKit點擊的mouseenter /懸停事件

回答

相關問題