好了,所以让我给一点背景的问题是什么...问题与悬停工具提示的jQuery
我们的客户有一个有9个独特的联系,这上空盘旋时淡出的主页活动区潜在的默认背景图像与当时与悬停链接相关联的前方图像时,工具提示在该链接上被发射并且具有图库描述和链接到图库。在鼠标移出时,默认图像会重新出现在链接后面。
问题是,当鼠标悬停在链接上,然后将鼠标悬停在相应的工具提示上时,鼠标事件触发链接。客户希望图片在鼠标悬停在工具提示上时也可以保留。下面是代码我目前有:
$("a#building1").mouseover(function() {
$("#main_image").fadeOut(1, function(){
$("#main_image").load(function() { //avoiding blinking, wait until loaded
$("#main_image").fadeIn();
});
$("#main_image").attr("src", "link-to-image-here");
});
// each unique link has a class of building
$("a.building").mouseout(function() {
$("#main_image").fadeOut(1 ,function(){
$("#main_image").load(function() { //avoiding blinking, wait until loaded
$("#main_image").fadeIn();
});
$("#main_image").attr("src", "/images/banners/default.png");
});
});
这里是HTML标记
<a id="building1" class="building" href="#"></a>
<div class="tooltip">
<span class="event-title">Event title</span>
<span class="location">Event location</span>
<a href="link-to-gallery" class="view-photos-btn">View Wedding Photos</a>
</div>
我想我可能使用的.next()在jQuery库目标为每个建筑工具提示然而,我无法将它保持在悬停状态,并用鼠标将其替换为默认值。有任何想法吗?提前致谢!
-Derek
为什么你不使用.tooltip上的mouseout事件? –