悬停时的Jquery标题

我在jQuery中编写了一个简单的脚本，它允许根据.hover触发器弹出标题

问题是，您必须将鼠标悬停在图像上，然后移出，然后再将鼠标悬停在图像上，然后图像才能工作。（你可以理解我在这里的意思）

这是

（document.ready（）

部分的问题还是jQuery本身的小故障？我真的看不出这里的问题，似乎太简单了，搞砸了哈哈

jQuery(document).ready(function() {
$(".projectImages li").hover(

function() {
    $(this).find(".imageCaption").animate({
        opacity: "show",
        bottom: "0"
    }, "fast");
},

function() {
    $(this).find(".imageCaption").animate({
        opacity: "hide",
        bottom: "-50"
    }, "fast");
});
});

尝试：

---

将图像标题类调整为

display:none。更改该选项将为第一次悬停定义处于正确状态的元素

.imageCaption{
    display:none;
    position:absolute;
    background:#f0f;
    bottom:-50px;
    width:100%;
    color:#fff;
}

由于元素的初始状态为block，因此从未执行鼠标enter，因为它已设置为block

更新了使用jQuery在页面加载时隐藏元素：


.imageCaption{
    display:none;
    position:absolute;
    background:#f0f;
    bottom:-50px;
    width:100%;
    color:#fff;
}