我使用jquery创建一个小滑块插件。当鼠标位于左侧或右侧控制区域上方时,图像将从左侧或右侧滑动5%。点击后,图片会滑入100%
问题是当在动画中从左到右完全滑动时移动鼠标控制div我可以检查鼠标是否总是在左侧div上再次触发鼠标悬停事件。结果是左侧和右侧的图像显示为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");
} } );
}
})
我使用的方式来自另一个答案......但是它的删除......
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");
} } );
}
使用var isOver我可以触发左或右
答案 0 :(得分:32)
要检查是否有东西悬停,可以使用:hover选择器,例如:
$('#test').click(function() {
if ($('#hello').is(':hover')) {
alert('hello');
}
});
答案 1 :(得分:19)
actionshrimp的答案在jQuery 1.9.1中被打破。
改为使用
$("#idOfYourElement:hover").length > 0