mikef
08-10-2002, 12:12 AM
I downloaded a javscript (which invloves some Dhtml) off a free site a long time ago but just decided to use it now. It works in IE 4 AND IE 5 as well as NS 4 and 5 but doesn't work in version 6 of IE (i suspect not in NS 6 either but haven't checked). I figured a JS that works in a previous browser version would also work in the newer version.
Here is the code. Much thanks to anyone who helps.
<style type="text/css">
<!--
#divLinks{position:absolute; left:200; top:250; visibility:hidden}
#divMessage{position:absolute; left:200; width:300; top:280; visibility:hidden}
A{color:blue; text-decoration:none}
A:link{color:red}
A:hover{color:green}
A:active:{color:green; font-size: 125%}
H1 {color:blue; font-size:12pt}
DIV{font-family:arial,helvetica; font-size:10pt; font-weight:bold}
TD{font-family:arial,helvetica; color:blue; font-size:18pt; font-weight:bold}
-->
</style>
<script type="text/javascript" language="JavaScript">
//Default browsercheck, added to all scripts!
function checkBrowser(){ this.ver=navigator.appVersion
this.dom=document.getElementById?1:0
this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;
this.ie4=(document.all && !this.dom)?1:0;
this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;
this.ns4=(document.layers && !this.dom)?1:0;
this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5)
return this
}
bw=new checkBrowser()
/*NOTE**************************************************************************
Now works in IE4, IE5, NS4, NS5 and degrades for older browsers.
BUG: On Gecko M9 there's a problem with the replaceNode command..Should work on
the released version
********************************************************************************/
/****
Variables to set
****/
msgFont='Arial,helvetiva' //The font for the message
msgFontSize=12 //Set the fontSize in px
msgFontColor="Navy" //Set the fontColor
//Set the text you want to display on mouseover here.
messages=new Array()
messages[0]="Nextel's product and accessory service centers give you the convenience of getting your phones programmed, accessories replaced, phones repaired, when and where you need."
messages[1]="i1000plus product and feature guide."
messages[2]="i700plus product and feature guide"
messages[3]="i500plus product and feature guide"
messages[4]="i600 product and feature guide"
messages[5]="Your new Nextel phone allows you to receive text or numeric pages instantly. Pages will be displayed directly on your phone. You'll quickly find the text and numeric paging service convenient and easy to use."
messages[6]="Put your mouse over the links"
//This is the default text that appears when you mouse out
/********You don't have to change anything below this
********************************************************************************/
//Constructing the ChangeText object
function makeChangeTextObj(obj){
this.css=bw.dom? document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?document.layers[obj]:0;
this.writeref=bw.dom? document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?document.layers[obj].document:0;
this.writeIt=b_writeIt;
}
function b_writeIt(text,num){
if(bw.ns4){
this.writeref.write(text)
this.writeref.close()
}else if(bw.dom){
this.writeref.replaceChild(document.createTextNode(messages[num]),this.writeref.childNodes[0])
}else if(bw.ie4) this.writeref.innerHTML=messages[num]
}
//The mouoseover function. Calls the objects writeIt method to write the text to the div.
function changeText(num){
if(bw.bw) oMessage.writeIt('<span style="font-size:' +msgFontSize+'px; font-family:'+msgFont+'; color:'+msgFontColor+'">'+messages[num]+'</span>',num)
}
//The init function. Calls the object constructor and set some properties.
function changeTextInit(){
if(bw.bw){
oMessage=new makeChangeTextObj('divMessage')
oLinks=new makeChangeTextObj('divLinks')
if(bw.dom || bw.ie4){ //Setting the style properties
with(oMessage.writeref.style){fontFamily=msgFont; fontSize=msgFontSize; color=msgFontColor}
}
//Both layers are hidden by default to prevent users from mousing over them and creating errors while the page loads
oMessage.css.visibility='visible'
oLinks.css.visibility='visible'
}
}
//Calls the init function on pageload.
onload=changeTextInit
</script>
</HEAD>
<BODY bgcolor="White">
<div id="divLinks">
<a href="http://www.nextel.com/cgi-bin/getSvcLocations.cgi" onmouseover="changeText(0)" onMouseout="changeText(6,0)">Service Centers</a> <b>|</b>
<a href="http://www.nextel.com/care/i1000plusguide/index.shtml" onmouseover="changeText(1)" onmouseout="changeText(6,1)">i1000plus</a> <b>|</b>
<a href="http://www.nextel.com/care/i700plusguide/index.shtml" onmouseover="changeText(2)" onmouseout="changeText(6,2)">i700plus</a> <b>|</b>
<a href="http://www.nextel.com/care/i500plusguide/index.shtml" onmouseover="changeText(3)" onmouseout="changeText(6,3)">i500plus</a> <b>|</b>
<a href="http://www.nextel.com/care/i600guide/index.shtml" onmouseover="changeText(4)" onmouseout="changeText(6,4)">i600</a> <b>|</b>
<a href="http://www.nextel.com/paging/index.html" onmouseover="changeText(5)" onmouseout="changeText(6,5)">Send a Page</a>
</div>
<div id="divMessage">Move your mouse over the above links for a description. These links take you to
the Nextel web site.</div>
Here is the code. Much thanks to anyone who helps.
<style type="text/css">
<!--
#divLinks{position:absolute; left:200; top:250; visibility:hidden}
#divMessage{position:absolute; left:200; width:300; top:280; visibility:hidden}
A{color:blue; text-decoration:none}
A:link{color:red}
A:hover{color:green}
A:active:{color:green; font-size: 125%}
H1 {color:blue; font-size:12pt}
DIV{font-family:arial,helvetica; font-size:10pt; font-weight:bold}
TD{font-family:arial,helvetica; color:blue; font-size:18pt; font-weight:bold}
-->
</style>
<script type="text/javascript" language="JavaScript">
//Default browsercheck, added to all scripts!
function checkBrowser(){ this.ver=navigator.appVersion
this.dom=document.getElementById?1:0
this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;
this.ie4=(document.all && !this.dom)?1:0;
this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;
this.ns4=(document.layers && !this.dom)?1:0;
this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5)
return this
}
bw=new checkBrowser()
/*NOTE**************************************************************************
Now works in IE4, IE5, NS4, NS5 and degrades for older browsers.
BUG: On Gecko M9 there's a problem with the replaceNode command..Should work on
the released version
********************************************************************************/
/****
Variables to set
****/
msgFont='Arial,helvetiva' //The font for the message
msgFontSize=12 //Set the fontSize in px
msgFontColor="Navy" //Set the fontColor
//Set the text you want to display on mouseover here.
messages=new Array()
messages[0]="Nextel's product and accessory service centers give you the convenience of getting your phones programmed, accessories replaced, phones repaired, when and where you need."
messages[1]="i1000plus product and feature guide."
messages[2]="i700plus product and feature guide"
messages[3]="i500plus product and feature guide"
messages[4]="i600 product and feature guide"
messages[5]="Your new Nextel phone allows you to receive text or numeric pages instantly. Pages will be displayed directly on your phone. You'll quickly find the text and numeric paging service convenient and easy to use."
messages[6]="Put your mouse over the links"
//This is the default text that appears when you mouse out
/********You don't have to change anything below this
********************************************************************************/
//Constructing the ChangeText object
function makeChangeTextObj(obj){
this.css=bw.dom? document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?document.layers[obj]:0;
this.writeref=bw.dom? document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?document.layers[obj].document:0;
this.writeIt=b_writeIt;
}
function b_writeIt(text,num){
if(bw.ns4){
this.writeref.write(text)
this.writeref.close()
}else if(bw.dom){
this.writeref.replaceChild(document.createTextNode(messages[num]),this.writeref.childNodes[0])
}else if(bw.ie4) this.writeref.innerHTML=messages[num]
}
//The mouoseover function. Calls the objects writeIt method to write the text to the div.
function changeText(num){
if(bw.bw) oMessage.writeIt('<span style="font-size:' +msgFontSize+'px; font-family:'+msgFont+'; color:'+msgFontColor+'">'+messages[num]+'</span>',num)
}
//The init function. Calls the object constructor and set some properties.
function changeTextInit(){
if(bw.bw){
oMessage=new makeChangeTextObj('divMessage')
oLinks=new makeChangeTextObj('divLinks')
if(bw.dom || bw.ie4){ //Setting the style properties
with(oMessage.writeref.style){fontFamily=msgFont; fontSize=msgFontSize; color=msgFontColor}
}
//Both layers are hidden by default to prevent users from mousing over them and creating errors while the page loads
oMessage.css.visibility='visible'
oLinks.css.visibility='visible'
}
}
//Calls the init function on pageload.
onload=changeTextInit
</script>
</HEAD>
<BODY bgcolor="White">
<div id="divLinks">
<a href="http://www.nextel.com/cgi-bin/getSvcLocations.cgi" onmouseover="changeText(0)" onMouseout="changeText(6,0)">Service Centers</a> <b>|</b>
<a href="http://www.nextel.com/care/i1000plusguide/index.shtml" onmouseover="changeText(1)" onmouseout="changeText(6,1)">i1000plus</a> <b>|</b>
<a href="http://www.nextel.com/care/i700plusguide/index.shtml" onmouseover="changeText(2)" onmouseout="changeText(6,2)">i700plus</a> <b>|</b>
<a href="http://www.nextel.com/care/i500plusguide/index.shtml" onmouseover="changeText(3)" onmouseout="changeText(6,3)">i500plus</a> <b>|</b>
<a href="http://www.nextel.com/care/i600guide/index.shtml" onmouseover="changeText(4)" onmouseout="changeText(6,4)">i600</a> <b>|</b>
<a href="http://www.nextel.com/paging/index.html" onmouseover="changeText(5)" onmouseout="changeText(6,5)">Send a Page</a>
</div>
<div id="divMessage">Move your mouse over the above links for a description. These links take you to
the Nextel web site.</div>