W e have tested the code in IE6.0, Firefox1.5.0.1, Opera8.52, Netscape7.02, Netscape8.1 and AOL Explorer1.2. This script worked in IE and AOL Explorer1.2 only. All other platforms tested you will not see this effect. It degrades well and you will not get any error messages.
Reconfigurations
S
ince this is a one step copy and paste code, you paste the script anywhere in the <BODY> section that you want the mouseover box to appear.
Below is where you make your basic cosmetic congifurations to the button to have it adapt to your site's look and feel.
<CENTER>
<TABLE BORDER="2" CELLPADING="2" CELLSPACING="2" BGCOLOR="brown">
<TR><TD BGCOLOR="blue">
<FONT SIZE="3" COLOR="white" STYLE="cursor:hand"* ONMOUSEOUT="dis()" ONMOUSEOVER="chen()">
<B>Pertinent Site Info</A><BR></FONT>
</TD></TR>
</TABLE>
</CENTER>
* This references what cursor will be visible on mouseover. There are numerous different ones you can substitute for the hand. If you grab the below link, you can see how many different choices you have. Just do not use the span tag that is on that page, just use the word that is associated with each cursor.
[ Different Cursors ]
B elow Are Window Cosmetics, Window Size And Positioning.
<font size=2 face="arial narrow">
<input type=button name="add" style="position:absolute;top:50;left:400;*
background-color:yellow;color:black;border-color:black;height:0;width:0">
* The above is for all intensive purposes an absolute positioning tag. In other words, no matter where you place this part of the code, the coodinates will mandate where the popup info will appear. If this is a little confusing it is actuually quite simple. The
style="position:absolute;top:50;left:400;
means no matter where you place the button, then place your cursor on it for the popup, the popup will appear 50 pixels from the top of the page and 400 pixels from the left side of the page. Ok, you place the button at the bottom of the page and the absolute position tag is configured as is. You will "Not see the pop up, it is there(at the top of the page) (as positioned) but since the button is at the bottom it is out of view.. If this is still a little unclear, grab the below link and absolute positioning tags are fully explained.
[ Absolute Positioning Tags ]
B elow Is Where You Add Your Messages And Pop Up Window Size.
<!-- Begin
function chen()
{
add.value="Web Site\nJavaScript Source \nhttp://javascript.internet.com/
\nPart of the INT Media Group\nhttp://www.internet.com
\nThanks for visiting us\nCome back soon!"
add.style.height=120
add.style.width=260
}
W f you will notice the \n between every message. This has to stay to divide each and every message. You can add more as long as you continue the pattern. Also if you add more than the default amount of messages you need to adjust the pop up window size to fit more messages.
For your Information:
To answer your next question, the answer is "No", you cannot use this effect in more than one place on the page. It won't work.
W
e hope our tutorial was easy to follow and we covered everything in detail. If you would like to add this effect into your pages, grab the respective below link and you are there. We have searched the [ Original Script Site ] and to the best of our abilities cannot locate the script on their server. Therefore we are now archiving the code for your convenience. If you have any problems with this or anything else, feel free to consult our [ FAQ ] and if you can't find the answer there, [ contact us ].
[ Get Code Here ]
[ Rate This Page ]
