遮罩(點選陰影部分才隱藏)
阿新 • • 發佈:2018-11-17
<!--遮罩--> <div class="dialog"> <div class="dialog-contain"> <div class="dialog-texts"> <div class="dialog-header"> </div> <div class="dialog-center"> </div> <div class="dialog-footer"> </div> </div> </div> </div>
.dialog{ display: none; background: rgba(0, 0, 0, 0.7); position: fixed; top: 0px; bottom: 0; right: 0; left: 0; z-index: 9; font-size:1.6rem; .dialog-contain{ width: 30%; height:50%; overflow: hidden; background: white; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding:2rem; .dialog-texts{ height:100%; overflow-y: auto; } } }
$(".dialog").click(function(){
$(this).hide();
})
$(".dialog .dialog-contain").on("click",function(e){
e.stopPropagation();
})