javascript - Jquery : Overlapping Div cause triggering Div to lost focus -
i have current issue , current div placement
<div class="photo-wrapper" style="positon:relative"> <div class="img-menu" style="position:absolute"> <img src="@url.content("~\content\images\checkin.png")" /> <br /><br /> <img src="@url.content("~\content\images\btn-login.png")"/> </div> <div class="avatar-wrap"><img src="bg.jpg"/></div> </div>
and have mouseover event
$(".photo-wrapper").mouseover(function () { //show specific password $(this).find('.img-menu').fadein('fast'); }); $(".photo-wrapper").mouseout(function () { $('.img-menu').each(function () { $(this).stop().css('display', 'none') }); });
let .img-menu on top of .photo-wrapper , , .img-menu half of photo wrapper size . when hover photo-wrapper , img-menu come out . when move cursor img-menu , mouseover flicker once . how make think img-menu part of photo-wrapper hover wont lost focus ?
try
$(".photo-wrapper").mouserenter(function () { //show specific password $(this).find('.img-menu').fadein('fast'); }); $(".photo-wrapper").mouseleave(function () { $('.img-menu').each(function () { $(this).stop().css('display', 'none') }); });
Comments
Post a Comment