JQuery Pop-up layer plugin (recommended) _jquery

Recently in the study of pop-up layer Plug-ins found that many plug-ins on the web is very powerful, but also a large number of plug-ins. Here personally wrote a comparison of the show-Jane pop-up layer plug-ins.

Jquery.popdialog.js

$ (function () {$.fn. Popdialog = function (options) {var defaults = {Event: "click",///Trigger Response Event Title: "title",//Pop-up header type: "Text",//Pop-up layer type ( Text, container ID, URL, iframe content: Contents,//Popup layer (text text, container ID name, URL address, iframe address) width:500,//Pop-up layer width height:400,// The height of the pop-up layer scrolltop:200,//layer sliding height is the pop-up layer from the top sliding distance isauto:false,//whether automatically pop-up time:2000,//Set up automatic pop-up layer time, the premise is Isauto=true ISCLOSE:FA
LSE,//whether automatically turn off timeout:2000//Set automatic shutdown time, the premise is isclose=true};
var options = $.extend (defaults, options); $ ("Body"). Prepend ("<div id= ' floatboxbg ' ></div><div id= ' floatbox '" class= ' Floatbox ') ><div class= ' title ' > 

matching CSS:

* {padding:0; margin:0;} #floatBoxBg {display:none; width:100%; height:100%; background: #000; position:fixed!i mportant;
/*ie7 ff*/Position:absolute;
top:0;
left:0;
Filter:alpha (opacity=0);
opacity:0;
}. Floatbox {border: #9CC95F 5px solid; position:fixed!important;/*ie7 ff*/the position:absolute; top:50px;
Background: #fff;
Display:none; Floatbox. title {height:23px padding:7px 10px 0; color: #fff; background-attachment:scroll; background: #9CC95F; b
Ackground-repeat:repeat-x;
background-position:0px 0px;
}. Floatbox. title H4 {float:left; padding:0; margin:0; font-size:14px; line-height:16px;} floatbox. title span {
Float:right;
Cursor:pointer; Floatbox. Content {padding:20px 15px; background: #fff; overflow-x: hidden; overflow-y: auto;} #closeDialog {font-s
ize:20px;
Font-weight:bold;
Color: #000;
Margin-top: -5px; #closeDialog: hover {font-size:20px; font-weight:bold; color: #fff; Margin-top: -5px;}

Final HTML example:

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">  

The above is a small set to introduce the jquery pop-up layer plug-in (recommended) related knowledge, I hope to help you, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!