JQuery при наведении анимации и проблема с кликом

Question

есть список изображений в качестве навигации.когда вы наводите на них курсор, div с прозрачным фоном скользит вверх.когда вы наведите курсор мыши, слайд скользит вниз.

эта часть выглядит как шарм.

теперь, когда вы нажимаете на изображение или заголовок, div с заголовком изменяет непрозрачность до 1, перемещаетсяк верху изображения и достигает 100% высоты.

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

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

здесь приведен код с попыткой использования .unbind:

var thumbslide = $('.boxgrid.captionfull').hover(
    function() { //Hover over
        $(this).children('.cover').stop().animate({'top':'130px'},{queue:false,duration:350});
    },function() { //Hover out
        $(this).children('.cover').stop().animate({'top':'230px'},{queue:false,duration:350});
    }
    ).click(function() {
        $(this).children('.cover').stop().animate({'top':'0px', height:"230px", opacity:"1"},{queue:false,duration:350}).unbind('mouseleave');
});

Answer 1

Это потому, что вы отвязываете детей , а не элемент, на котором вы находитесь.Переставь это так:

$(this).unbind('mouseleave').children('.cover').stop().animate({'top':'0px', height:"230px", opacity:"1"},{queue:false,duration:350});

Answer 2

Вы могли бы просто проверить Whth или непрозрачность при наведении ...

внутри функции парения, которую вы выполняете

if($(this).children('.cover').css('opacity')!=1){
$(this).children('.cover').stop().animate({'top':'230px'},{queue:false,duration:350});
}