[Javascript] Could someone explain this to me.

Peter-Paul Koch gassinaumasis at hotmail.com
Tue Jan 15 03:44:15 CST 2002


>I found the following code on-line. It allows for a box to pop-up when one
>clicks a hyperlink. Below is the code, I understand it starts out
>determining what browser is being used. Then the function showtip is where
>the confusion comes in.
>
>The first if statement: in plain english if NN6 or IE6 do the following.
>It never says to show the div or to put text into the div or anything. What
>is going on here?

The script is using the TITLE attribute, the value of which pops up in a box 
when you go over a link. Try it:

<A HREF="somewhere" TITLE="Go somewhere">Mouse over this</A>

The script is needlessly complicated (a simple current.title=text is enough, 
no need for for-loops or additional if's after the initial support detect 
(doc.getElementById etc)). Even worse, the function is not at all necessary, 
since

<a href="javascript:void(0)" title='This is a
Williamson Ether Synthesis'>hint<img
src="hintbutton.gif" alt="" width="66" height="22" border="0"></a>

works as well. Only for Netscape 4 is the script truly needed, since this 
browser doesn't support TITLEs.

>The else if statement makes sense to me. If NN4 build the string and assign
>to the box, put the box where in relation to where you clicked....

Correct

>Then comes the function hidetip. It only says to hide for NN4. What happens
>to NN6 and IE6?

If you leave the link the title automatically becomes invisible. No need for 
a script.

>Also this script only works for text that is in the <a></a> tag. It does 
>not
>work with an image as I have coded below. Why?

I'm not sure what happens to the TITLE of an image. Try simply putting a 
TITLE attribute in whatever you want to use and see what happens. Do your 
students use NN4? If not, remove all code and put TITLEs into whatever you 
want.

Hope this helps,

ppk

><script >
><!--
>
>if (!document.layers&&!document.all&&!document.getElementById)
>event="test"
>function showtip(current,e,text){
>
>if (document.all||document.getElementById){
>thetitle=text.split('<br>')
>if (thetitle.length>1){
>thetitles=''
>for (i=0;i<thetitle.length;i++)
>thetitles+=thetitle[i]
>current.title=thetitles
>}
>else
>current.title=text
>}
>
>else if (document.layers){
>document.tooltip.document.write('<layer bgColor="white" style="border:1px
>solid black;font-size:12px;">'+text+'</layer>')
>document.tooltip.document.close()
>document.tooltip.left=e.pageX+5
>document.tooltip.top=e.pageY+5
>document.tooltip.visibility="show"
>}
>}
>function hidetip(){
>if (document.layers)
>document.tooltip.visibility="hidden"
>}
>//-->
></script>
>
><div id="tooltip" style="position:absolute;visibility:hidden"></div>
>
><a href="javascript:void(0)" onclick="showtip(this, event,'This is a
>Williamson Ether Synthesis')" onMouseout="hidetip()">hint<img
>src="hintbutton.gif" alt="" width="66" height="22" border="0"></a>



_________________________________________________________________
Send and receive Hotmail on your mobile device: http://mobile.msn.com




More information about the Javascript mailing list