Jquery如何在關閉內部彈出框後突出顯示外部彈出框？

我創造了另一個彈出式內的彈出窗口。這裏是我的代碼，Jquery如何在關閉內部彈出框後突出顯示外部彈出框？

<html> 
<head> 
    <title>Popup</title> 
    <script type="text/javascript" src="jquery-1.6.1.min.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
      //open popup 
      $("#pop").click(function(){ 
       $("#background").css({"opacity" : "0.7"}).fadeIn("slow");  
       $("#overlay_form").fadeIn(1000);        
       positionPopup();     
      }); 
      $("#plus").click(function(){ 
       $("#background").css({"opacity" : "0.7"}).fadeIn("slow"); 
     $("#overlay_form").css({"opacity" : "0.7"}).fadeIn("slow");  
       $("#inner_form").fadeIn(1000);        
       positionPopup();     
      }); 
      //close popup 
      $("#close").click(function(){ 
       $("#overlay_form").fadeOut(500); 
       $("#background").fadeOut("slow");  
     document.getElementById("loc").value=""; 
     document.getElementById("uname").value=""; 
      }); 
      $("#innerclose").click(function(){ 
       $("#inner_form").fadeOut(500); 
     $("#overlay_form").fadeIn(500);  
     var newloc=document.getElementById("nloc").value; 
     document.getElementById("loc").value=newloc; 
     document.getElementById("nloc").value=""; 
      }); 
     }); 
     //position the popup at the center of the page 
     function positionPopup(){ 
       if(!$("#overlay_form").is(':visible')){ 
       return; 
       } 
       $("#overlay_form").css({ 
        left: ($(window).width() - $('#overlay_form').width())/2, 
        top: ($(window).width() - $('#overlay_form').width())/7, 
        position:'absolute' 
       }); 
     $("#inner_form").css({ 
        left: ($(window).width() - $('#inner_form').width())/2, 
        top: ($(window).width() - $('#inner_form').width())/5, 
        position:'absolute' 
       });   
     } 
     //maintain the popup at center of the page when browser resized 
     $(window).bind('resize',positionPopup); 
    </script> 
    <style> 
     #background{ 
      display: none; 
      position: absolute; 
      height: 100%; 
      width: 100%; 
      top: 0; 
      left: 0; 
      background: #000000; 
      z-index: 1; 
     } 
     #overlay_form{ 
     position: absolute; 
     border: 5px solid gray; 
     padding: 10px; 
     background: white; 
     width: 270px; 
     height: auto; 
      z-index:10; 
     } 
     #inner_form{ 
     position: absolute; 
     border: 5px solid gray; 
     padding: 10px; 
     background: white; 
     width: 250px; 
     height: auto; 
      z-index:12; 
     }  
     #pop{ 
     display: block; 
     border: 1px solid gray; 
     width: 65px; 
      height: auto; 
     text-align: center; 
     padding: 6px; 
     border-radius: 5px; 
     text-decoration: none; 
     margin: 0 auto;     
     } 
    </style> 
</head> 
<body> 
<div id="background"></div> 
<a href="#" id="pop" >PopUp</a> 
<br /> 
<form id="overlay_form" style="display:none"> 
    <label>Name</label><input type="text" name="uname" id="uname" /><br/><br/> 
    <label>Location</label><input type="text" name="loc" id="loc" /><a href="#" id="plus" style="text-decoration:none;"> + </a><br/> <br/> 
    <a href="#" id="close">Close</a>  
</form> 
<form id="inner_form" style="display:none"> 
<label>New Location</label><input type="text" name="nloc" id="nloc" /> 
<a href="#" id="innerclose">Close</a> 
</form> 
</body>

在此，我想顯示關閉內彈出後在外側彈出色澤鮮豔。如果外部彈出窗口關閉，則瀏覽器窗口將顯示爲明亮。

來源

2012-12-20 ijarlax

得到某處運行的一個預覽版？或的jsfiddle – Ladineko

這裏的小提琴http://jsfiddle.net/CPE6m/ – anmarti

Here is a fiddle。如果我理解正確，這個問題應該得到解決。

我添加的唯一的事情是在$("#innerclose")的點擊回調$("#overlay_form").css({"opacity" : "1"}).fadeIn("slow");。

來源

2012-12-20 11:09:23

我看不到你和提問者的一個任何區別。 – anmarti

其中包含一些文本輸入（名稱，位置）的第一個彈出淡入時，嵌套彈出（一個是隻是單場）淡出。 –

okey似乎是正確的。 – anmarti

Jquery如何在關閉內部彈出框後突出顯示外部彈出框？

回答

相關問題