function: Zhou En ce classmate recently wrote a jquery based information pop-up plug-in Showinfodialog, the plugin to the background mask, and then pop-up information display box, information display categories include:
I. Description of the type of information:
1.1. Operation Success Information
1.2. Error message
1.3. Warning message
1.4. Notification information
Second, the use of instructions
Copy Code code as follows:
<! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en" "HTTP://WWW.W3.ORG/TR/HTML4/LOOSE.DTD" >
<meta http-equiv= "Content-type" content= "text/html; Charset=utf-8 ">
<title>insert title here</title>
<link href= "Style/showinfodialog.css" rel= "stylesheet" type= "Text/css"/>
<script type= "Text/javascript" src= "Js/jquery-1.6.2.min.js" ></script>
<script type= "Text/javascript" src= "Js/jquery-ui-1.9.1.custom.min.js" ></script>
<script type= "Text/javascript" src= "Js/jquery-showinfodialog.js" ></script>
<body style= "Background-color: #4ed" >
<div id = "Test" style= "Width:1000px;height:800px;background-color: #fff" >
</div>
<script type= "Text/javascript" >
var options = {
' DialogType ': ' Info ',
' Theme ': ' Info ',
' Message ': ' Data loading complete! ',
' Refresh ': false
};
$ ("#test"). Showinfodialog (options);
</script>
</body>
In this case, the label with the ID test is masked and the information is displayed
Simple settings:
In addition to including the necessary js,css files, you need to set the Dialogtype,theme property, DialogType There are four ways: success,error,warning,info; Corresponds to four theme (theme) settings: Success,error,warning,info
Message is the data that needs to be displayed;
Refresh indicates whether the page needs to be reloaded after closing the pop-up box
Extensions: You can add your own theme, the format is as follows:
Copy Code code as follows:
. info {border:3px solid #2FADD7; background: #92D6ED repeat-x top;}
. info span {color: #0E7A9F;}
. info. closestatus A {background: #2FADD7;}
. info. closestatus a:hover {background: #228DB0;}