/**
* jquery wbox plugin
* wbox是一个轻量级的弹出窗口jquery插件,基于jquery1.4.2开发,
* 主要实现弹出框的效果,并且加入了很多有趣的功能,比如可img灯箱效果,callback函数,显示隐藏层,ajax页面,iframe嵌入页面等功能
* @name wbox
* @author wangyongqing - http://www.js8.in(王永清 http://www.js8.in)
* @version 0.1
* @copyright (c) 2010 wangyongqing (js8.in)
* @example visit http://www.js8.in/mywork/wbox/ for more informations about this jquery plugin
*/
(function($){
//class为.wbox_close为关闭
$.fn.wbox = function(options){
var defaults = {
wboxurl: "wbox/",
opacity: 0.8,//背景透明度
callback: null,
notitle: false,
show:false,
timeout:0,
target:null,
requesttype:null,//iframe,ajax,img
title: "金科真空材料有限公司公告",
drag:true,
iframewh: {//iframe 设置高宽
width: 500,
height: 300
},
html: ''//wbox内容
},_this=this;
this.yq = $.extend(defaults, options);
var wboxhtml = '
', b = null, c = null, $win = $(window),$t=$(this);//b背景,c内容jquery div
this.showbox=function (){
$("#wbox_overlay").remove();
$("#wbox").remove();
b = $("").hide().addclass('wbox_overlaybg').css('opacity', _this.yq.opacity).dblclick(function(){
_this.close();
}).appendto('body').fadein(300);
c = $(wboxhtml).appendto('body');
handleclick();
}
/*
* 处理点击
* @param {string} what
*/
function handleclick(){
var con = c.find("#wboxcontent");
if (_this.yq.requesttype && $.inarray(_this.yq.requesttype, ['iframe', 'ajax','img'])!=-1) {
con.html("");
if (_this.yq.requesttype === "img") {
var img = $("");
img.attr("src",_this.yq.target);
img.load(function(){
img.appendto(con.empty());
setposition();
});
}
else
if (_this.yq.requesttype === "ajax") {
$.get(_this.yq.target, function(data){
con.html(data);
c.find('.wbox_close').click(_this.close);
setposition();
})
}
else {
ifr = $("");
ifr.appendto(con.empty());
ifr.load(function(){
try {
$it = $(this).contents();
$it.find('.wbox_close').click(_this.close);
fh = $it.height();//iframe height
fw = $it.width();
w = $win;
neww = math.min(w.width() - 40, fw);
newh = w.height() - 25 - (_this.yq.notitle ? 0 : 30);
newh = math.min(newh, fh);
if (!newh)
return;
var lt = calposition(neww);
c.css({
left: lt[0],
top: lt[1]
});
$(this).css({
height: newh,
width: neww
});
}
catch (e) {
}
});
}
}
else
if (_this.yq.target) {
$(_this.yq.target).clone(true).show().appendto(con.empty());
}
else
if (_this.yq.html) {
con.html(_this.yq.html);
}
else {
$t.clone(true).show().appendto(con.empty());
}
afterhandleclick();
}
/*
* 处理点击之后的处理
*/
function afterhandleclick(){
setposition();
c.show().find('.wbox_close').click(_this.close).hover(function(){
$(this).addclass("on");
}, function(){
$(this).removeclass("on");
});
$(document).unbind('keydown.wbox').bind('keydown.wbox', function(e){
if (e.keycode === 27)
_this.close();
return true
});
typeof _this.yq.callback === 'function' ? _this.yq.callback() : null;
!_this.yq.notitle&&_this.yq.drag?drag():null;
if(_this.yq.timeout){
settimeout(_this.close,_this.yq.timeout);
}
}
/*
* 设置wbox的位置
*/
function setposition(){
if (!c) {
return false;
}
var width = c.width(), lt = calposition(width);
c.css({
left: lt[0],
top: lt[1]
});
var $h = $("body").height(), $wh = $win.height(),$hh=$("html").height();
$h = math.max($h, $wh);
b.height($h).width($win.width())
}
/*
* 计算wbox的位置
* @param {number} w 宽度
*/
function calposition(w){
l = ($win.width() - w) / 2;
t = $win.scrolltop() + $win.height() /9;
return [l, t];
}
/*
* 拖拽函数drag
*/
function drag(){
var dx, dy, moveout;
var t = c.find('.wbox_dragtitle').css('cursor', 'move');
t.bind("selectstart", function(){
return false;
});
t.mousedown(function(e){
dx = e.clientx - parseint(c.css("left"));
dy = e.clienty - parseint(c.css("top"));
c.mousemove(move).mouseout(out).css('opacity', 0.8);
t.mouseup(up);
});
/*
* 移动改变生活
* @param {object} e 事件
*/
function move(e){
moveout = false;
if (e.clientx - dx < 0) {
l = 0;
}
else
if (e.clientx - dx > $win.width() - c.width()) {
l = $win.width() - c.width();
}
else {
l = e.clientx - dx
}
c.css({
left: l,
top: e.clienty - dy
});
}
/*
* 你已经out啦!
* @param {object} e 事件
*/
function out(e){
moveout = true;
settimeout(function(){
moveout && up(e);
}, 10);
}
/*
* 放弃
* @param {object} e事件
*/
function up(e){
c.unbind("mousemove", move).unbind("mouseout", out).css('opacity', 1);
t.unbind("mouseup", up);
}
}
/*
* 关闭弹出框就是移除还原
*/
this.close=function (){
if (c) {
b.remove();
c.stop().fadeout(300, function(){
c.remove();
})
}
}
/*
* 触发click事件
*/
$win.resize(function(){
setposition();
});
_this.yq.show?_this.showbox():$t.click(function(){
_this.showbox();
return false;
});
return this;
};
})(jquery);