本文主要是介绍jquery点击空白处隐藏弹出层的写法,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
jquery点击空白处隐藏弹出层的写法
点击按钮展开弹出层以及点击关闭按钮关闭弹出层的效果,都很简单,但是展开弹出层后点击空白处也能关闭弹出层的效果,一开始对我来说却是有点难度的,研究了一下,分享给大家看看。
html代码
<div class="mark-cover">
<div class="ins">
<div class="ins">
内容
</div>
</div><!--弹出层的html代码-->
按钮的代码
<a href="javascript:void(0)" data-showmark></div>
jquery代码
$(function(){showCover();closeCover();bodyClick();
});
var selectConhideflag=true;
function bodyClick(){$(".mark-cover").click(function(e){ if(selectConhideflag){$(".mark-cover").hide();}else{selectConhideflag=true;}});
}
function closeCover(){$(".mark-cover .ins").click(function(){selectConhideflag=false;});
}
function showCover(){$("[data-showmark]").click(function(){selectConhideflag=true;$(".mark-cover").show();});
}
这篇关于jquery点击空白处隐藏弹出层的写法的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!