2 WebSnapr - Preview Bubble Javascript
\r
3 Written by Juan Xavier Larrea
\r
4 http://www.websnapr.com - xavier@websnapr.com
\r
8 // Point this variable to the correct location of the bg.png file
\r
9 var bubbleImagePath = 'resources/bubble_bg.png';
\r
11 if(typeof Array.prototype.push!="function"){
\r
12 Array.prototype.push=ArrayPush;
\r
14 function ArrayPush(_1){
\r
15 this[this.length]=_1;
\r
19 function WSR_getElementsByClassName(_2,_3,_4){
\r
21 var _5=(_3=="*"&&_2.all)?_2.all:_2.getElementsByTagName(_3);
\r
23 _4=_4.replace(/\-/g,"\\-");
\r
24 var _7=new RegExp("(^|\\s)"+_4+"(\\s|$)");
\r
26 for(var i=0;i<_5.length;i++){
\r
28 if(_7.test(_8.className)){
\r
35 function bindBubbles(e){
\r
36 lbActions=WSR_getElementsByClassName(document,"a","bubble");
\r
37 for(i=0;i<lbActions.length;i++){
\r
38 if(window.addEventListener){
\r
39 lbActions[i].addEventListener("mouseover",attachBubble,false);
\r
40 lbActions[i].addEventListener("mouseout",detachBubble,false);
\r
42 lbActions[i].attachEvent("onmouseover",attachBubble);
\r
43 lbActions[i].attachEvent("onmouseout",detachBubble);
\r
48 function attachBubble(_b){
\r
50 if(_b["srcElement"]){
\r
51 _c=_b["srcElement"];
\r
55 if (_c.href == undefined){
\r
60 var _e=findPos(_c)[0]+5;
\r
61 var _f=findPos(_c)[1]+17;
\r
62 var _10=document.createElement("div");
\r
63 document.getElementsByTagName("body")[0].appendChild(_10);
\r
64 _10.className="bubble";
\r
66 if (BrowserDetect.browser == 'Explorer') {
\r
67 _10.style.width="240px";
\r
68 _10.style.position="absolute";
\r
70 _10.style.zIndex=99999;
\r
72 _10.style.textAlign="left";
\r
73 _10.style.height="190px";
\r
74 _10.style.paddingTop="0";
\r
75 _10.style.paddingLeft="0";
\r
76 _10.style.paddingBottom="0";
\r
77 _10.style.paddingRight="0";
\r
78 _10.style.marginTop="0";
\r
79 _10.style.marginLeft="0";
\r
80 _10.style.marginBottom="0";
\r
81 _10.style.marginRight="0";
\r
82 _10.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + bubbleImagePath + "',sizingMethod='image')";
\r
84 _10.setAttribute("style","text-align: center; z-index: 99999; position: absolute; top: "+_f+"px ; left: "+_e+"px ; background: url("+ bubbleImagePath +") no-repeat; width: 240px; height: 190px; padding: 0; margin: 0;");
\r
87 if (BrowserDetect.browser == 'Safari' || BrowserDetect.browser == 'Konqueror' ) {
\r
91 _10.setAttribute("style","text-align: center; z-index: 99999; position: absolute; top: "+ _height +"px ; left: "+_e+"px ; background: url("+ bubbleImagePath +") no-repeat; width: 240px; height: 190px; padding: 0; margin: 0;");
\r
95 var img=document.createElement("img");
\r
96 _10.appendChild(img);
\r
98 if (BrowserDetect.browser == 'Explorer') {
\r
99 img.style.paddingTop="0";
\r
100 img.style.paddingLeft="0";
\r
101 img.style.paddingBottom="0";
\r
102 img.style.paddingRight="0";
\r
103 img.style.margin="auto";
\r
104 img.style.marginTop="27px";
\r
105 img.style.marginLeft="25px";
\r
106 img.style.marginBottom="0";
\r
107 img.style.marginRight="0";
\r
108 img.style.borderTop="0";
\r
109 img.style.borderLeft="0";
\r
110 img.style.borderBottom="0";
\r
111 img.style.borderRight="0";
\r
113 img.setAttribute("style","padding-top: 0; padding-left: 0; padding-right: 0; padding-bottom: 0; margin-top: 27px; margin-left: 12px; margin-bottom: 0; margin-right: 0; border: 0");
\r
115 img.setAttribute("src","phpfspot_img.php?idx=" + _c.id + "&width=200");
\r
116 img.setAttribute("width",202);
\r
117 img.setAttribute("height",152);
\r
118 img.setAttribute("alt","Snapshot");
\r
121 function detachBubble(_12){
\r
122 lbActions=WSR_getElementsByClassName(document,"div","bubble");
\r
123 for(i=0;i<lbActions.length;i++){
\r
124 lbActions[i].parentNode.removeChild(lbActions[i]);
\r
128 /*if(window.addEventListener){
\r
129 addEventListener("load",bindBubbles,false);
\r
131 attachEvent("onload",bindBubbles);
\r
134 function findPos(obj){
\r
136 if(obj.offsetParent){
\r
137 _14=obj.offsetLeft;
\r
138 curtop=obj.offsetTop;
\r
139 while(obj=obj.offsetParent){
\r
140 _14+=obj.offsetLeft;
\r
141 curtop+=obj.offsetTop;
\r
144 return [_14,curtop];
\r
147 var BrowserDetect = {
\r
148 init: function () {
\r
149 this.browser = this.searchString(this.dataBrowser) || "An unknown browser";
\r
150 this.version = this.searchVersion(navigator.userAgent)
\r
151 || this.searchVersion(navigator.appVersion)
\r
152 || "an unknown version";
\r
153 this.OS = this.searchString(this.dataOS) || "an unknown OS";
\r
155 searchString: function (data) {
\r
156 for (var i=0;i<data.length;i++) {
\r
157 var dataString = data[i].string;
\r
158 var dataProp = data[i].prop;
\r
159 this.versionSearchString = data[i].versionSearch || data[i].identity;
\r
161 if (dataString.indexOf(data[i].subString) != -1)
\r
162 return data[i].identity;
\r
165 return data[i].identity;
\r
168 searchVersion: function (dataString) {
\r
169 var index = dataString.indexOf(this.versionSearchString);
\r
170 if (index == -1) return;
\r
171 return parseFloat(dataString.substring(index+this.versionSearchString.length+1));
\r
174 { string: navigator.userAgent,
\r
175 subString: "OmniWeb",
\r
176 versionSearch: "OmniWeb/",
\r
177 identity: "OmniWeb"
\r
180 string: navigator.vendor,
\r
181 subString: "Apple",
\r
185 prop: window.opera,
\r
189 string: navigator.vendor,
\r
194 string: navigator.vendor,
\r
196 identity: "Konqueror"
\r
199 string: navigator.userAgent,
\r
200 subString: "Firefox",
\r
201 identity: "Firefox"
\r
204 string: navigator.vendor,
\r
205 subString: "Camino",
\r
208 { // for newer Netscapes (6+)
\r
209 string: navigator.userAgent,
\r
210 subString: "Netscape",
\r
211 identity: "Netscape"
\r
214 string: navigator.userAgent,
\r
216 identity: "Explorer",
\r
217 versionSearch: "MSIE"
\r
220 string: navigator.userAgent,
\r
221 subString: "Gecko",
\r
222 identity: "Mozilla",
\r
223 versionSearch: "rv"
\r
225 { // for older Netscapes (4-)
\r
226 string: navigator.userAgent,
\r
227 subString: "Mozilla",
\r
228 identity: "Netscape",
\r
229 versionSearch: "Mozilla"
\r
234 string: navigator.platform,
\r
236 identity: "Windows"
\r
239 string: navigator.platform,
\r
244 string: navigator.platform,
\r
245 subString: "Linux",
\r
252 function var_dump(obj) {
\r
253 if(typeof obj == "object") {
\r
254 return "Type: "+typeof(obj)+((obj.constructor) ? "\nConstructor: "+obj.constructor : "")+"\nValue: " + obj;
\r
256 return "Type: "+typeof(obj)+"\nValue: "+obj;
\r
258 }//end function var_dump
\r
261 BrowserDetect.init();
\r