简化后的插件：
simpleplugin.htm：
复制代码 代码如下:
简化后的插件
jquery.simpleplugin.js：
复制代码 代码如下:
$.fn.dialog=function(){
this.maskdiv=function()//自定义一个函数
{
//创建遮罩背景,这里没有设置透明度，为了简单。zindex决定了遮罩。
$(body).append(
);
$(body).find(#maskid).width(888px).height(666px)
.css({position:absolute,top:0px,left:0px,background:#ccc,zindex:10000});
}
this.maskdiv();//调用自定义函数。
$(body).append(提示
);
var obj=$(body).find(#divdialog);
obj.width(200px).height(200px);
obj.css({position:absolute,top:100px,left:100px,background:#ffcc66,zindex:10001}).show(slow);
return this;
}
完整的插件：
myplugin.html：
复制代码 代码如下:
练习jquery插件
jquery.dialog.js：
复制代码 代码如下:
// jscript 文件
$.fn.dialog=function(){
this.maskdiv=function()//自定义一个函数
{
var wnd = $(window), doc = $(document);
if(wnd.height() > doc.height()){ //当高度少于一屏
wheight = wnd.height();
}else{//当高度大于一屏
wheight = doc.height();
}
//创建遮罩背景
$(body).append(
);
$(body).find(#maskid).width(wnd.width()).height(wheight)
.css({position:absolute,top:0px,left:0px,background:#ccc,filter:alpha(opacity=90);,opacity:0.3,zindex:10000});
}
this.sposition=function(obj)//自定义一个带参数的函数
{
var mydiv_w = parseint(obj.width());
var mydiv_h = parseint(obj.height());
var width =parseint($(document).width());
var height = parseint($(window).height());
var left = parseint($(document).scrollleft());
var top = parseint($(document).scrolltop());
var div_topposition = top + (height / 2) - (mydiv_h / 2); //计算上边距
var div_leftposition = left + (width / 2) - (mydiv_w / 2); //计算左边距
return array(div_topposition,div_leftposition);
}
this.maskdiv();
$(body).append(提示
);
var obj=$(body).find(#divdialog);
obj.width(200px).height(200px);
post=this.sposition(obj);
obj.css({position:absolute,top:post[0]+px,left:post[1]+px,background:#ffcc66,zindex:10001}).show(slow);
return this;
}