JQuery проверить состояние наведения перед запуском запуска
Я создаю небольшой плагин слайдер с JQuery. изображения будут скользить на 5% слева или справа, когда мышь находится над левым или правым контрольным делителем. При нажатии изображение сдвигается на 100%
проблема заключается в том, что при перемещении мыши во время полного слайда в анимации от элемента управления слева направо я могу проверить, всегда ли мышь находится над левым элементом, чтобы снова вызвать событие наведения мыши. В результате изображение слева и справа показывают 5%.
Есть ли способ проверить наведение мыши, как этот?
if($(this).mouseover())
$(".right").trigger("mouseover");
код контроллера div выглядит следующим образом
$(".right",this).bind({
mouseover:function(){
if( vars.current == $("img").length-1 || vars.running) return false;
$("img:eq("+(vars.current+1)+")").removeAttr("style").css({position:"absolute",left:"100%","z-index":vars.current+1}).show().animate({left:"95%"}, {queue: false})
},
mouseleave:function(){
if( vars.current == $("img").length-1 || vars.running) return false;
$("img:eq("+(vars.current+1)+")").animate({left:"100%"}, {queue: false , complete:function(){ $(this).hide() } });
},
click:function(){
if( vars.current == $("img").length-1 || vars.running) return false;
vars.running = true;
$("img:eq("+(vars.current+1)+")").animate({left:"0%"}, {queue: false, complete:function(){
$("img:eq("+vars.current+")").hide();
$(this).css({"z-index":0})
vars.current++;
vars.running = false;
if($(this).mouseover())
$(".right").trigger("mouseover");
} } );
}
})
я использую способ из другого ответа... но его deletet....
mouseover:function(){
isOver = 'right';
if( vars.current == $("img").length-1 || vars.running) return false;
$("img:eq("+(vars.current+1)+")").removeAttr("style").css({position:"absolute",left:"100%","z-index":vars.current+1}).show().animate({left:"95%"}, {queue: false})
},
mouseleave:function(){
isOver = false
if( vars.current == $("img").length-1 || vars.running) return false;
$("img:eq("+(vars.current+1)+")").animate({left:"100%"}, {queue: false , complete:function(){ $(this).hide() } });
},
click:function(){
if( vars.current == $("img").length-1 || vars.running) return false;
vars.running = true;
$("img:eq("+(vars.current+1)+")").animate({left:"0%"}, {queue: false, complete:function(){
$("img:eq("+vars.current+")").hide();
$(this).css({"z-index":0})
vars.current++;
vars.running = false;
if(isOver)
$("."+isOver).trigger("mouseover");
} } );
}
с помощью переменной isOver я мог бы вызвать левую или правую
2 ответа
Чтобы проверить, находится ли что-то, вы можете использовать селектор:hover, например:
$('#test').click(function() {
if ($('#hello').is(':hover')) {
alert('hello');
}
});
Пример здесь: http://jsfiddle.net/AyAZx/5/
Ответ Actionshrimp не работает с JQuery 1.9.1.
Используйте вместо
$("#idOfYourElement:hover").length > 0
в вашем случае если