Question

我正在尝试在悬停时添加一个简单的jQuery slidedown函数。当我将动作附加到文档正文时，我可以让slidedown工作，但是当我用作链接的图像被附加时，它会不行。这里是div的设置

jQuery(document).ready( function(){
jQuery('.desTitle').hide()
});
jQuery('#desGal').hover(function()
{
jQuery('.desTitle').slideDown('slow');
});

HTML是：

<div id="contain">
<div class="desTitle"><a href="link"><img src="imgTitle"></a></div>
<div id="desGal"><a href="link"><img src="img"></a></div>
</div>

我认为链接是问题，但我不确定。是否可以在链接上创建jQuery悬停事件？

Answer 1

将悬停事件注册放在document.ready内。事件注册表可能在元素#desGal存在/文档加载之前发生。

jQuery(document).ready(function () {
    jQuery('.desTitle').hide();

   jQuery('#desGal').hover(function () {
    jQuery('.desTitle').slideDown('slow');
});
});

您的意思是切换幻灯片，然后使用slideToggle()

Answer 2

我使用以下CSS来隐藏要在hover上显示的原始图片：

CSS

.desTitle {
    display:none;
}

然后添加了以下JavaScript代码，还管理了悬停的out事件：

的JavaScript / jQuery的

jQuery('#desGal').hover(function () {
    jQuery('.desTitle').slideToggle('slow');
});

使用jQuery悬停在链接上

2 个答案:

CSS

的JavaScript / jQuery的

JSFiddle