javascript - Close a div by clicking outside -
i want hide div clicking on close link in it, or clicking anywhere outside div.
i trying following code, opens , close div clicking close link properly, if have problem close clicking anywhere outside div.
$(".link").click(function() { $(".popup").fadein(300); } ); $('.close').click(function() { $(".popup").fadeout(300); } ); $('body').click(function() { if (!$(this.target).is('.popup')) { $(".popup").hide(); } } );
<div class="box"> <a href="#" class="link">open</a> <div class="popup"> hello world <a class="close" href="#">close</a> </div> </div>
an other way makes jsfiddle less buggy (needed double click on open).
this doesn't use delegated event body level
set tabindex="-1"
div .popup ( , style css outline:0
)
$(".link").click(function(e){ e.preventdefault(); $(".popup").fadein(300,function(){$(this).focus();}); }); $('.close').click(function() { $(".popup").fadeout(300); }); $(".popup").on('blur',function(){ $(this).fadeout(300); });
Comments
Post a Comment