将鼠标hover在隐藏的元素上以显示它
有没有办法将鼠标hover在已隐藏的元素上。 我试图模仿Steam在他们的主页上用箭头导航做什么。 你会注意到，当你第一次到达页面时，没有箭头显示：
然后，当您将鼠标hover在应该有箭头的区域时，它会显示自己：
我已经尝试设置包含箭头图像的div来display: none并且还尝试了visibility: hidden但似乎既不适用于jQuery中的hover或鼠标hover方法。 我会想到visibility: hidden会使它工作，但似乎并非如此。 有没有其他方法我可以从一开始就隐藏这些div，但仍然可以让hover事件对它们起作用？
将其设置为零不透明度：
$('#blah').hover(function() { $(this).fadeTo(1,1); },function() { $(this).fadeTo(1,0); });
您不能将鼠标hover在不可见元素或未显示元素上。 您可以将鼠标hover在可见元素上，然后使用它来显示不同的先前隐藏元素。 或者您可以将鼠标hover在透明元素上并使其不透明。
这是一个使用CSS的不透明技术的例子，它也适用于jQuery的hover。
CSS：
#it { opacity: 0; width: 500px; height:500px; } #it:hover { opacity: 1; }
下面是一个显示另一个元素hover在其上的元素的示例：
HTML：
Hover over me to display something else Something else
jQuery的：
$("#me").hover(function(){ $("#else").show(); },function(){ $("#else").hide(); });
使用.fadeTo jQuery方法在hover状态下更改元素的不透明度。
jQuery站点包含一个示例，但是这样的东西就足够了
$("element").hover(//On Hover Callback function() {$(this).fadeOut(100);} , //Off Hover Callback function() {$(this).fadeIn(500);})
来自jQuery Hover页面。
您可以将其设置为opacity: 0 。
为了使它跨浏览器，你可能想用jQuery来做。
一种方法是使用备用命中测试div，使其没有内容，但是当它hover在它上面时显示“箭头”div。 当退出“箭头”div（或命中测试div）时，将再次隐藏“箭头”div。
或者，您可以使用相同的div作为命中测试和“箭头”，这样背景图像将用于div的视觉元素。 hover时，您可以指示将图像的偏移设置为显示“箭头”的位置。 退出时，您可以将背景的偏移设置为不再显示箭头图像的位置。
最后，如果内容始终与命中测试区域位于同一位置，则可以将div的不透明度设置为零，并相应地切换。
您可以将元素的不透明度设置为0.这将允许它们接收hover事件（实际上是mouseenter和mouseleave），但实际上，要使它们对用户不可见。