Z-index solves the problem that the pop-up layer mask layer overwrites the sub-div and cannot display the output. z-indexdiv

Z-index solves the problem that the pop-up layer mask layer overwrites the sub-div and cannot display the output. z-indexdiv

// Add the following code for testing:
// If an ajax error occurs, it will be executed
$ ('Body'). ajaxError (function (e, xhr, setting, text ){
// E-event
// Xhr-XMLHttpRequest object
// Setting-ajax settings
// Text-error message
Alert (text );
});
 
// After ajax is complete, it will execute
$ ('Body'). ajaxComplete (function (){
Alert ('complete'); // The ajax request is executed when it is completed.
})


$. Ajax ({
Url: '/sms/AjaxSMS. ashx ',
Type: "POST ",
Data: "txtcontent =" + content + "& txtback =" + content2 + "",
Async: false,
Success: function (data ){
If (data = "succeeded" | data = "[object XMLDocument]") {
IsAddSuffix (hdtatolSMS, arr, mob); // suffix
Confirm ("the number of messages you sent this time is:" + (parseInt (hdtatolSMS) * arr. length) + ". Are you sure you want to send it? ");
} Else {
Alert (content + "may involve content that cannot be sent by advertising, marketing, and other systems. Please modify the content before sending it. ");
}
},
Error: function (){
Alert (a. responseText );
}
});

// Add a suffix to determine
Function IsAddSuffix (data, arr, mob ){
Var txtBack = document. getElementById ("ctl00_ContentPlaceHolder1_txtBack"). value;
If (txtBack = ""){
Confirm ("the suffix is blank. The number of text messages you sent this time is:" + (parseInt (data) * arr. length) + ". Are you sure you want to send it? ");
} Else {
If (txtBack. length + mob. value. length> maxnums-1 ){
The length of alert ("content with a suffix (space automatically added by the System) cannot exceed" + maxnums + "characters. Please enter it again! ");
}
}
}

 

 

<Script type = "text/javascript" language = "javascript">
$ (Function (){
// Pop-up prompt box (new domain name of kuaigo)
Var isRead = getHCookie ('waretids ');
If (isRead = null ){
PopupDiv ('pop-div ');
}

Function popupDiv (div_id ){
Var div_obj = $ ("#" + div_id );
Var export wwidth = document.doc umentElement. clientWidth;
Var transport wheight = document.doc umentElement. clientHeight;
Var popupHeight = div_obj.height ();
Var popupWidth = div_obj.width ();
// Add and display the Mask Layer
$ ("<Div id = 'mask'> </div>"). addClass ("mask ")
. Width (wxwwidth * 0.99)
. Height (optional wheight * 0.99)
//. Css ({"position": "absolute", "background": "# CCCCCC", "left": "0px", "top": "0px", "zIndex ": "1", "filter": "Alpha (Opacity = 60)"}) covering layer
. Css ({"position": "absolute "})
. Click (function () {hideDiv (div_id );})
. AppendTo ("body ")
. FadeIn (200 );
Div_obj.css ({"position": "absolute "})
. Animate ({left: Drawing wwidth/2-popupWidth/2,
Top: Running wheight/2-popupHeight/2, opacity: "show"
}, "Slow ");
}




});
Function hideDiv (div_id ){
$ ("# Mask"). remove ();
$ ("#" + Div_id). animate ({left: 0, top: 0, opacity: "hide"}, "slow ");
// Record cookie
SetHCookie ('waretids', 'read ');
// Window. parent. del ();
}

Function SetHCookie (name, value) // two parameters, one is the cookie name and the other is the value
{
Var Days = 1; // This cookie will be saved for 1 day
Var exp = new Date ();
Exp. setTime (exp. getTime () + Days x 24x60*60*1000 );
Document. cookie = name + "=" + escape (value) + "; expires =" + exp. toGMTString ();
}
Function getHCookie (name) // The cookie function.
{
Var arr = document. cookie. match (new RegExp ("(^ |)" + name + "= ([^;] *) (; | $ )"));
If (arr! = Null) return unescape (arr [2]); return null;
}
Function delHCookie (name) // delete a cookie
{
Var exp = new Date ();
Exp. setTime (exp. getTime ()-1 );
Var cval = getHCookie (name );
If (cval! = Null) document. cookie = name + "=" + cval + "; expires =" + exp. toGMTString ();
}
</Script>

The cursor input scheme of the z-index mask layer: the mask layer problem. You must set z-index, which must be smaller than the value of the parent div element. Otherwise, the effect will be lost.

The CSS mask layer cannot completely mask pages.

The height: 100% indicates the height of the browser window, that is, the body you set: 100%. If the content on your page exceeds the display range in the browser window, that is, the scroll bar appears. If you pull the scroll bar, the unmasked content will appear below. You can first determine the height of your page content and the size of the browser window, and assign the maximum value to the height of the mask layer.

Js pop-up layer and mask layer with iframe

Zindex is relative to the div of the same page. It is of course invalid if you are a cross-page.
You can change the pop-up window in your iframe to the parent page. the pop-up window uses js to write data back or process iframe.