Jquery подписи на Hover

Question

Я написал простой скрипт в jQuery, который позволяет всплывать и выводить заголовок на основе триггера .hover.

Проблема в том, что вам нужно навести курсор на изображение, затем вернуться назаднаведите на него курсор еще раз, пока он не заработал.(вы можете видеть, что я имею в виду здесь http://jsfiddle.net/sambeckhamdesign/bqjqb/)

Это проблема с частью (document).ready() или просто сбой в самом jQuery? Я действительно не вижу проблемы здесь, кажется, слишком просто, чтобы запутатьсяup lol.

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");
});
});

Answer 1

Настройте класс заголовка вашего изображения на display:none;. Изменение этого параметра должно определить элемент в правильном состоянии для первого наведения.

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

Поскольку ваше начальное состояние элемента было заблокировано, ввод мышью никогда не выполнялся, поскольку он уже был установлен для блокировки.

Обновлено jsfiddle

Answer 2

Используйте jQuery, чтобы скрыть элемент при загрузке страницы:

http://jsfiddle.net/FrelCee/bqjqb/33/

Answer 3

Попробуйте:

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


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