基于jquery的显示窗体控件 可控制位置

基于jquery开放的显示窗体控件，可设置<div>的位置在中间或左下角，或右下角。

//显示一个指定位置的窗口，这个是基于jquery开发的，必须引入jquery包，没有的搜下，到处都是，一脚踩一个
/*
*@param position如果是center就在浏览器的中间
如果是rigthDown就在浏览器的右下角
如果是leftDown就在浏览器的坐下角
如果输入的是个json对象就安坐标设置位置例如：{left:100,top:100}
*/
$.fn.myWindows = function(position) {

var windowobj = $(window);
var browserWidth = windowobj.width(); //浏览器的宽
var browserHieght = windowobj.height(); //浏览器的高
var scrollLeft = windowobj.scrollLeft(); //滚动条的横位置
var scrollTop = windowobj.scrollTop(); //滚动条的竖位置
var selfWidth = this.outerWidth(true); //这个元素的宽包括magin,padding
var selfheight = this.outerHeight(true); //这个元素的高包括magin,padding

var left;
var top;
//中间的窗口
if (position == center) {
left = scrollLeft + (browserWidth - selfWidth) / 2; //获取左边的距离
top = scrollTop + (browserHieght - selfheight) / 2; //获取上边的距离
} else if (position == rigthDown) {
//右下角窗口
left = scrollLeft + browserWidth - selfWidth;
top = scrollTop + browserHieght - selfheight;
} else if (leftDown) {
left = scrollLeft + 0;
top = scrollTop + browserHieght - selfheight;
}
else if (position && position instanceof Object) {
left = position.left;
top = position.top;
}
this.css(position,absolute); //让这个容器绝对定位
this.css(left,left).css(top,top); //设置这个元素的位置

var self = this;
//找到这个元素下clsss是title的元素，这个元素下的图片点击事件，让这个窗口隐藏
this.children(.title).children(img).click(function() {
self.hide(show);
});

return this; //返回对象本身方便连级操作
}

下面是调用的方法：

HTML代码：

<div style=width:100px;height:100px;display:none>
<div class=title>
<img src=''/>
这个是窗体的标题部分，class必须等于title这个图片用来关闭这个窗口的
<div>
这里是你的内容
<div>
<input type=button id=showDiv value=显示窗体 onclick=showWindows()>

javascript代码：

<script>
function showWindows() {
$(#windwosDiv).myWindows(leftDown);
}
</script>