var w_popup = function (extend){
var self = this;
this.source = null;
this.extend = extend;
this.timer = null;
this.coords = function getCoords(elem) {
var box = elem.getBoundingClientRect();
var body = document.body;
var docEl = document.documentElement;
var scrollTop = window.pageYOffset || docEl.scrollTop || body.scrollTop;
var scrollLeft = window.pageXOffset || docEl.scrollLeft || body.scrollLeft;
var clientTop = docEl.clientTop || body.clientTop || 0;
var clientLeft = docEl.clientLeft || body.clientLeft || 0;
var top = box.top + scrollTop - clientTop;
var left = box.left + scrollLeft - clientLeft;
return { top: Math.round(top), left: Math.round(left) };
}
this.fixPosition = function (){
var c = self.coords(this.source[0]), obj = $("#w-popup-1"),
w = obj.find(".w-header")[0];
obj[0].style.position = "absolute";
console.log(obj[0].offsetWidth);
obj[0].style.top = c.top - parseInt(self.css(w, "paddingTop")) + "px";
obj[0].style.left = (c.left + this.source[0].offsetWidth) - (obj[0].offsetWidth - parseInt(self.css(w, "paddingRight"))) + "px";
}
this.css = function (elem, name) {
// J/S Pro Techniques p136
if (elem.style[name]) {
return elem.style[name];
} else if (elem.currentStyle) {
return elem.currentStyle[name];
}
else if (document.defaultView && document.defaultView.getComputedStyle) {
name = name.replace(/([A-Z])/g, "-$1");
name = name.toLowerCase();
s = document.defaultView.getComputedStyle(elem, "");
return s && s.getPropertyValue(name);
} else {
return null;
}
}
this.init = function (){
this.source = $("#" + this.extend.source);
this.source.mouseover(function (evt){
$("#w-popup-1").animate({opacity: 'show'}, 'fast');
$("#w-popup-1").css("display", "inline-block");
self.fixPosition();
evt.preventDefault();
return false;
})
$("#w-popup-1").mouseout(function (evt){
$("#w-popup-1").animate({opacity: 'hide'}, 'fast')
})
}
this.init();
};
$(document).ready(function (evt){
new w_popup({source: "w-popup-enter"})
})
