/********* atxt.js Taken from abc site with navtxt replaced by popup_text vers 1 AJM 17/01/2006 Extended version of ALTTXT */ /********************************************************************************************* ALTTXT V1.6 BY: BRIAN GOSSELIN OF SCRIPTASYLUM.COM with amendments by Hilary Forbes of DMR Limited INSTRUCTIONS: 1: PUT THESE DIVS IN THE END OF THE BODY AREA: 2: NEXT, DEFINE the above someclass in your stylesheet 3: THEN, SET THE 6 SETTINGS BELOW ( dofade, centertext, xoffset, yoffset, mousefollow, and hideDelay ) AS DESIRED. 4: LASTLY ADD THE MOUSEOVER/MOUSEOUT EVENT HANDLERS TO EACH LINK THAT YOU WANT THIS EFFECT FOR: EXAMPLE: print "Move mouse over this
" NOTES: > YOU CAN CAUSE A BOX *NOT* TO DISAPPEAR ONCE THE MOUSE LEAVES THE LINK BY SIMPLY OMITTING THE onmouseout="writetxt(0)" PART. THIS WILL CAUSE THE CURRENT BOX TO REMAIN VISIBLE. THIS IS BEST USED WHEN mousefollow MODE IS DISABLED (SET TO false). > YOU CAN SET THE PADDING STYLE ATTRIBUTE *ONLY* IN THE popup_txt DIV ITSELF AND *NOT* IN THE STYLE SHEET AT THE TOP OF THE PAGE. OTHERWISE NS4 DISPLAYS SOME WEIRD BEHAVIOR. ALSO, THE PADDING ATTRIBUTE ONLY HAS AN EFFECT IN IE4+ AND NS6+. *********************************************************************************************/ ////////////////////////////// NO NEED TO EDIT BEYOND THIS POINT ////////////////////////////////////// // Define the object prototype defaults // Setup the object properties altObject.prototype.w_y=0; altObject.prototype.w_x=0; altObject.prototype.popup_txt=null; altObject.prototype.boxheight=0; altObject.prototype.boxwidth=0; altObject.prototype.ishover=false; altObject.prototype.ieop=0; altObject.prototype.op_id=0; altObject.prototype.oktomove=false; altObject.prototype.dy=0; altObject.prototype.posvary=''; // DEFAULTS BELOW or specify your own after creating the object altObject.prototype.dofade=false; // enables fade-in effect (for ie4+ and ns6/firefox only. not opera) altObject.prototype.centertext=false; // centers the text inside the box. you can't simply do this via "style" because of ns4. // otherwise, text is left-justified. altObject.prototype.xoffset= new Number(30); // horizontal pixel count from cursor altObject.prototype.yoffset= new Number(10); // vertical pixel count from cursor // Functions below will need testing if altered altObject.prototype.mousefollow=false; // enables mouse follow mode where the box continues to follow the mouse. set to false to // lock the box wherever it initially appears. altObject.prototype.hideDelay=1; // delay in milliseconds ( 1 second = 1000 milliseconds) from when you hover out of link // and the box disappears only when "mousefollow" is set to "false". // this will give the user time to click a link or whatever in the box before it disappears. var isLoaded=false; function altObject(name,posvary,disable_mouseout) { // Finish creating the object this.popup_txt=(js_ns4)?document.layers[name]:(js_ie4)?document.all[name]:(js_w3c)?document.getElementById(name):null; this.posvary = posvary; this.getBoxWidth(); this.getBoxHeight(); this.getWindowDims(); if(js_ie4||js_ie5&&this.dofade)this.popup_txt.style.filter="alpha(opacity=100)"; this.popup_txt.onmouseover=function() { if(!this.mousefollow)clearTimeout(this.dy); } if (!disable_mouseout) { this.popup_txt.onmouseout=function() { if(!this.mousefollow)this.dy=setTimeout('this.hideAltTxt()',this.hideDelay); } } window.onresize=this.getWindowDims; isLoaded=true; if (parent.isloaded==false && do_onload()) do_onload(); } altObject.prototype.toggleCenterText=function () { this.centertext=!this.centertext; } altObject.prototype.toggleMouseFollow=function () { this.mousefollow=!this.mousefollow; } altObject.prototype.toggleDoFade=function () { this.dofade=!this.dofade; if(!this.dofade)this.ieop=100; } altObject.prototype.getWindowDims=function () { this.w_y=(js_ie5||js_ie4)?document.body.clientHeight:window.innerHeight; this.w_x=(js_ie5||js_ie4)?document.body.clientWidth:window.innerWidth; } altObject.prototype.getBoxWidth = function () { if(js_ns4)this.boxwidth=(this.popup_txt.document.width)? this.popup_txt.document.width : this.popup_txt.clip.width; else{ if(js_ie4)this.boxwidth=(this.popup_txt.style.pixelWidth)? this.popup_txt.style.pixelWidth : this.popup_txt.offsetWidth; else this.boxwidth=(this.popup_txt.style.width)? parseInt(this.popup_txt.style.width) : parseInt(this.popup_txt.offsetWidth); } } /********************************************************************************************* error somewhere in the section above - editplus identifies it as character 6? *********************************************************************************************/ altObject.prototype.getBoxHeight=function () { if(js_ns4)this.boxheight=(this.popup_txt.document.height)? this.popup_txt.document.height : this.popup_txt.clip.height; else{ if(js_ie4)this.boxheight=(this.popup_txt.style.pixelHeight)? this.popup_txt.style.pixelHeight : this.popup_txt.offsetHeight; else this.boxheight=parseInt(this.popup_txt.offsetHeight); } } altObject.prototype.movePopupTxt=function (x,y) { if (js_debug) jsLog.Info('Move box to x='+ x + ' y='+ y); if(js_ns4)this.popup_txt.moveTo(x,y); else{ this.popup_txt.style.left=x+'px'; this.popup_txt.style.top=y+'px'; } } altObject.prototype.getPageScrollY=function () { if(js_ie5||js_ie4)return (document.documentElement.scrollTop) ? document.documentElement.scrollTop : document.body.scrollTop; else return window.pageYOffset; } altObject.prototype.getPageScrollX=function () { if(js_ie5||js_ie4)return (document.documentElement.scrollLeft) ? document.documentElement.scrollLeft : document.body.scrollLeft; else return window.pageXOffset; } altObject.prototype.writeInDiv=function (text) { if(js_ns4){ this.popup_txt.document.open(); this.popup_txt.document.write(text); this.popup_txt.document.close(); }else this.popup_txt.innerHTML=text; } altObject.prototype.writeTxt=function (text) { if (isLoaded!=true) return; if (js_debug) jsLog.Info('x=' + this.xoffset + 'y=' + this.yoffset); if(this.dofade && (js_ie4||js_w3c))clearInterval(this.op_id); if(text!=0) { if(!this.mousefollow) { clearTimeout(this.dy); } this.oktomove=true; this.ishover=true; if(js_ns4)text=''; if(js_w3c||js_ie4)this.popup_txt.style.textAlign=(this.centertext)?"center":"left"; this.writeInDiv(text); writingText=true; if(js_ns4)this.popup_txt.visibility="show"; else{ this.popup_txt.style.visibility="visible"; this.popup_txt.style.display="block"; } this.getBoxHeight(); this.moveObj(); writingText=false; if((js_w3c||js_ie4) && this.dofade) { if(js_ie4||js_ie5)this.popup_txt.style.filter="alpha(opacity=0)"; if(js_ns6)this.popup_txt.style.MozOpacity=0; this.ieop=0; this.op_id=setInterval('this.increaseOpacity()',50); } }else{ this.hideAltTxt(); /** if(this.mousefollow)this.hideAltTxt(); else this.dy=setTimeout(hideATxt(this),this.hideDelay); **/ } } altObject.prototype.hideAltTxt=function () { if(js_ns4)this.popup_txt.visibility="hide"; else{ this.popup_txt.style.display="none"; this.popup_txt.style.visibility="hidden"; } this.writeInDiv(''); } altObject.prototype.increaseOpacity=function () { if(this.ieop<=100) { this.ieop+=7; if(js_ie4||js_ie5)this.popup_txt.style.filter="alpha(opacity="+this.ieop+")"; if(js_ns6)this.popup_txt.style.MozOpacity=this.ieop/100; }else clearInterval(this.op_id); } altObject.prototype.moveObj=function () { // if (writingText==true) { if(this.ishover && this.oktomove ) { if ( this.posvary!='fixed') { // mx=(js_ie5||js_ie4)?event.clientX:evt.pageX; // my=(js_ie5||js_ie4)?event.clientY:evt.pageY; // if (js_debug) jsLog.Info('cursor at ' + mx + "," + my); margin=(js_ie4||js_ie5)?5:25; if(js_ns6)if(document.height+27-window.innerHeight<0)margin=15; if(js_ns4)if(document.height-window.innerHeight<0)margin=10; if(js_ns4||js_ns6)mx-=this.getPageScrollX(); if(js_ns4)my-=this.getPageScrollY(); xoff= mx + parseInt(this.xoffset); yoff=(my+this.boxheight+parseInt(this.yoffset)-((js_ns6)?this.getPageScrollY():0)>=this.w_y)? -5-this.boxheight-parseInt(this.yoffset): parseInt(this.yoffset); this.movePopupTxt( Math.min(this.w_x-this.boxwidth-margin , Math.max(2,xoff))+this.getPageScrollX(), my+yoff+((!js_ns6)?this.getPageScrollY():0)); if(!this.mousefollow)this.oktomove=false; } } // }else{ // mx=(js_ie5||js_ie4)?event.clientX:evt.pageX; // my=(js_ie5||js_ie4)?event.clientY:evt.pageY; // } }