배경화면 전체 Dimmed 처리 함수 > Javascript

본문 바로가기
HOME

Javascript

사용자함수 | 배경화면 전체 Dimmed 처리 함수

페이지 정보

작성자 너갱이 작성일15-05-15 16:20 조회5,502회 댓글0건

본문

--------------- CSS ----------------

#mask {
position:absolute;
z-index:9000;
background-color:#000;
display:none;
left:0;
top:0;
}
.window{
display: none;
position:absolute;
left:100px;
top:100px;
z-index:10000;
}

 



------------- JS ---------------
 
function wrapWindowByMask(){
 
var maskHeight = $(document).height();
var maskWidth = $(window).width();
 
alert(maskHeight);
 
$('#mask').css({'width':maskWidth,'height':maskHeight});
 
$('#mask').fadeIn(1000);
$('#mask').fadeTo("slow",0.8);
 
$('.window').show();
}
 
$(document).ready(function(){
 
$('.openMask').click(function(e){
e.preventDefault();
wrapWindowByMask();
});
 
$('.window .close').click(function (e) {
e.preventDefault();
$('#mask, .window').hide();
});
 
 
$('#mask').click(function () {
$(this).hide();
$('.window').hide();
});
 
});
 


  • 페이스북으로 보내기
  • 트위터로 보내기
  • 구글플러스로 보내기


구)밤톨넷 PC 버전으로 보기