CSS下拉菜單保持在鼠標上可見

Question

任何人都可以在最好的方式上做到這一點嗎？

我今天創建了一個CSS下拉菜單，基於suckerfish的兒子。我想用JS稍微加強它，這樣在鼠標懸停時，<ul>就可以在鼠標上顯示，然後在屏幕上停留幾秒鐘。

這裏的仿下拉的CSS菜單

http://www.eagleworks.co.uk/test/cssdropdown/

任何鏈接或建議將是真棒鏈接。

感謝所有

Answer 1

您可以通過使用超時做到這一點。

類似下面應該工作：

創建一個全局變量：var theTimeout = null;

然後改變鼠標移開將鼠標懸停設置和清除分別超時。

sfEls[i].onmouseover=function() { 
    clearTimeout(theTimeout); 
    this.className+=" sfhover"; 
} 
sfEls[i].onmouseout=function() { 
    var self = this; 
    theTimeout = setTimeout(function(){ 
     self.className=this.className.replace(new RegExp(" sfhover\\b"), ""); 
    },2000); 
} 

如果您在網頁上公佈這些下拉菜單中不止一個，那麼你將需要超時數組，這樣你就不會在每次打開另一個菜單時覆蓋它們。