sigle div 태그를 활성화하고 전체 페이지를 비활성화하는 방법

Question

내 웹 응용 프로그램의 로그인/등록을 위해 jquery로 div를 여는 방법. Im div의 visible 속성을 변경하여 div를 표시 할 수 있습니다. 그러나 동시에 전체 페이지를 비활성화하려고합니다. 전체 페이지가 표시되어야하지만 텍스트, 버튼 또는 any와 같은 요소는 작동하지 않아야합니다.

<div id="header"> 
    <div id="navigation"> 
     <a href="#">Menu1</a><a href="#">Menu2</a><a href="#">Sign Up/Sign In</a><a href="#">About</a> 
    </div> 
</div> 
<div id="content"> 
    <div id = "dbox" style="visibility:hidden"> 
     <div id="register" style="visibility:visible> 
      <form .............</from> 
     </div> 
     <div id="login" style="visibility:hidden> 
      <form .............</from> 
     </div> 
     <div id="forgotpassword" style="visibility:hidden> 
      <form .............</from> 
     </div> 
    </div> 
    <div id="blog-content"> 
     <div> Page content </div> 
    </div> 

Answer 1

사용 표준 UI 요소 - JQuery UI dialog "모달"정권한다.

Answer 2

Create a modal-form,

또는 단순히

JQuery와 모달에서 양식을 넣고, 로그인에 대한

예,

$(function() { 
    $("#login").dialog({ 
     modal: true, 
     autoOpen: false, 
     buttons: { 
     Ok: function() { 
      $(this).dialog("close"); 
     } 
     Submit: function(){ 
      $(this).find('form').submit(); 
     } 
     } 
    }); 
    }); 

당신이이 같은 사업부를 사용하여 몸 후 배치 할 수 있습니다

Answer 3

. HTML 요소 중 998보다 큰 Z- 색인이 없는지 확인하십시오.

<div id="fade" style="position:fixed;width:100%;height:100%;background-color:#ffffff;opacity:.7;z-index:999;display:none;"></div> 

위의 내용은 상자가 표시됩니다.

<div id="yourBox" style="position:absolute;z-index:1000"> 

<1-- this is your popup box--> 

</div> 

전화의 버튼 클릭이나 어떤 경우 이것은

function disable() 
{ 
    var ele = document.getElementById('fade'); 
ele.style.display = "block"; 
ele.style.display = "yourBox"; 

}