PDA

View Full Version : Mouse over picture pop up



DOK
01-23-2007, 01:54 AM
Hello I'm DOK, i am new to java script, i am also using coffee cup visual site designer 5, My question is that in coffee cup, when you add the code it gives you 3 boxes and i'm unsure where to install all the code in the right places, I'm trying to get a picture to pop up when i mouse over a button and would like to use something similar to this script or code on this page if its possible, except instead of a link text use a button instead,
http://www.dynamicdrive.com/dynamicindex4/imagetooltip.htm

Also i've read some place that i have to add an onload code to be able to get this to work for more than one button,

The 3 boxes in coffee cup are labeled in order bodt html, header html, onload

Anyhelp would be great at this point, Thank you very much, DOK

DOK
01-23-2007, 06:18 PM
did i post this in the wrong forum or is their no answer for this, Thanks DOK

jscheuer1
01-23-2007, 07:04 PM
You really shouldn't be using Coffee Cup to install this script if you don't know what boxes in Coffee Cup do whatever and, even if you did know, it might still not work or be the best way. What you should use is a text editor, like Notepad. Once you have your page looking like you want it to without this script in Coffee Cup, save it and close Coffee Cup, then open the page in Notepad or Simple Text or your favorite text only editor.

Follow the instructions on the demo page. In the text editor you should be able to find the <head></head> and the <body></body> sections of the code referred to on the demo page that are bounded by these respective tags (the tag names are not case sensitive). The only difference is that instead of using something like this (from the demo page step 2):


<a href="#" onmouseover="doTooltip(event,0)" onmouseout="hideTip()">Link 1</a>

as your trigger, if you want a button, use something like this:


<input type="button" onmouseover="doTooltip(event,0)" onmouseout="hideTip()" value="Link 1">

Make sure to complete all 3 steps.

Once you are finished editing in the text editor, save the file and view/test it in the browser. It might not be safe to open the page again in Coffee Cup - this may automatically change something essential to the script's operation. Make a backup copy both before editing in the text editor and another backup copy after editing the script and before editing it in Coffee Cup again.

The script does have an onload event but, it is included - nothing special is required on your part to institute it unless your page already has another onload event.

DOK
01-23-2007, 07:27 PM
Thank you for the reply i will do as use suggest and not use coffee cup, The second code you have posted where you change from a href to input type "button" , where the buton is do i replace it with button.gif for example. Thank you again DOK

jscheuer1
01-23-2007, 07:47 PM
There are various ways to do an image and most of them can be used for just about anything you want. An image button is an input of the type image with a src attribute:


<input type="image" src="button.gif">

Like other buttons and inputs it can have other attributes. Here is our button from before, now as an image button:


<input type="image" onmouseover="doTooltip(event,0)" onmouseout="hideTip()" src="button.gif">

DOK
01-23-2007, 09:58 PM
Thank you again i managed to get it figured out and working, Many thanks again, DOK