Div显示并保持在鼠标悬停状态 - 即使在鼠标悬停时也会保留

Question

我一直在玩几种悬停div的方法，但是当鼠标悬停在链接上时，我测试的大多数方法只能保持不变。

我想要达到的是div在另一个div的悬停上出现，但即使鼠标离开div按钮也会保持。

一个例子是：http://www.prixtel.com/

我不介意，如果只是CSS或使用jQuery/JS混合。

谢谢！

我的示例：http://jsfiddle.net/h4rB9/1/

Answer 1

绑定，使DIV可见（关闭display：none或其他）的情况下使用类似jQuery的.mouseover() bind到鼠标悬停事件。如果你没有指定.mouseout（）绑定，那么它不会消失。

Answer 2

该网站正在使用脚本的效果。

如果你想使用JavaScript：

var myDiv = document.getElementById("myDiv"); 
if (document.addEventListener) { 
    myDiv.addEventListener("mouseover", function() { 
    // whatever it is you're doing on mouseover here 
    }, false); 
} else if (document.attachEvent) { 
    myDiv.attachEvent("onmouseenter", function() { 
    // whatever it is you're doing on mouseover here 
    }); 
} else { 
    myDiv.onmouseover = function() { 
    // whatever it is you're doing on mouseover here 
    } 
} 

的jQuery：

// I prefer mouseenter to mouseover, and jQuery lets you do that as does IE with attachEvent 

$("#myDiv").mouseenter(function() { 
    // whatever it is you're doing on mouseover here 
}); 

正如其他海报指出，关键是要忽略mouseout事件 - 使用悬停自动包括鼠标移开行为。