/**
* 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.9, //背景透明度
callBack: null,
noTitle: false,
show: false,
timeout: 0,
target: null,
requestType: null, //iframe,ajax,img
title: "",
drag: true,
top: null,
left: null,
fullSize: false,
autoMove: true,
iframeWH: {//iframe 设置高宽
width: null,
height: null
},
srocllType:"auto",
effect: false,
html: ''//wBox内容
}, _this = this;
this.YQ = $.extend(defaults, options);
//=============fullSize===========
if (this.YQ.fullSize) {
this.YQ.top = 0;
this.YQ.left = 0;
this.YQ.autoMove = true;
}
//--------------------------------
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).click(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(false);
});
}
else
if (_this.YQ.requestType === "ajax") {
$.get(_this.YQ.target, function (data) {
con.html(data);
C.find('.wBox_close').click(_this.close);
setPosition();
})
}
else {
var tWidth = _this.YQ.iframeWH.width;
var tHeight = _this.YQ.iframeWH.height;
//debugger;
if (_this.YQ.fullSize) {
tWidth = $win.width();
tHeight = $win.height() - 60;
$("#wBox").width(tWidth);
}
ifr = $("");
if (!_this.YQ.effect) {
$(ifr).width(_this.YQ.iframeWH.width);
$(ifr).height(_this.YQ.iframeWH.height);
}
ifr.appendTo(con.empty());
ifr.load(function () {
try {
//debugger;
w = $win;
$it = $(this).contents();
$it.find('.wBox_close').click(_this.close);
if ($it.width() > 0) fW = $it.width();
else fW = 600;
fW = tWidth ? tWidth : fW;
if ($it.height() > 0) fH = $it.height();
else
fH = 400;
fH = tHeight ? tHeight : fH;
newW = Math.min(w.width() - 40 - _this.YQ.left, fW);
newH = w.height() - 25 - (_this.YQ.noTitle ? 0 : 30) - _this.YQ.top;
newH = Math.min(newH, fH);
if (!newH)
return;
var lt = calPosition(newW);
C.css({
left: lt[0],
top: lt[1]
});
B.css({
left: $win.scrollLeft(),
top: $win.scrollTop()
});
if (_this.YQ.effect) {
$(this).animate({
width: newW, height: newH
});
} else {
$(this).width(newW);
$(this).height(newH);
}
}
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(true);
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(setSize) {
if (!C) {
return false;
}
var width = C.width(), lt = calPosition(width);
C.css({
left: lt[0],
top: lt[1]
});
//debugger;
var $h = $("body").height(), $wh = $win.height(), $hh = $("html").height();
var $minH = Math.min($h, $wh);
var $maxH = Math.max($h, $wh);
B.height($minH).width($win.width());
if (_this.YQ.fullSize) {
//debugger;
if (!setSize) {
C.find("IFRAME").height($wh - 60);
C.find("IFRAME").width($win.width() - 20);
}
$("#wBox").width($win.width());
}
}
/*
* 计算wBox的位置
* @param {number} w 宽度
*/
function calPosition(w) {
//debugger;
l = ($win.width() - w) / 2;
if (_this.YQ.left != null)
l = $win.scrollLeft() + _this.YQ.left;
t = $win.scrollTop() + $win.height() / 9;
if (_this.YQ.top != null)
t = $win.scrollTop() + _this.YQ.top;
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();
});
/*
滚动时
*/
$win.scroll(function () {
if (_this.YQ.autoMove) {
if (!C) {
return false;
}
var width = C.width(), lt = calPosition(width);
C.css({
left: lt[0],
top: lt[1]
});
B.css({
left: $win.scrollLeft(),
top: $win.scrollTop()
});
}
})
_this.YQ.show ? _this.showBox() : $t.click(function () {
_this.showBox();
return false;
});
return this;
};
})(jQuery);
