|Work/Jobs Talk about the business side of things. Advice, questions, inspiration, and moral support|
| ||Thread Tools|
Mouse-over effects, more info
If you know somewhere it is in tutorial or instruction format, can you direct me? I've been searching for something but keep getting retouchers websites that use it, and have it in their descriptions for sites. I just don't get how to do it.
I was basically thinking of having a low speed/high speed split, so the mouse over would be great for high speed viewers. If I ever work out how to do it!!
Help? I promise to the one who shows me the light, complete
Javscript rollovers are very simple...
<img src = "before.jpg" onmouseover="this.src='after.jpg'" onmouseout="this.src.'before.jpg'">
Thats all there is to it.
Just to break it down for you....
This is the HTML for an image <img src = "path/to/image.ext">
Where path/to/image.ext is the location of the image eg. images/image1.jpg
That line of code will produce an image in an html page. You have an img tag with the src (source) attribute of path/to/image.ext
Now we modify that code to change when we mouse over it.
We use the DHTML attribute, onmouseover, which does exactly what it says on the tin, the code assigned to that attribute will be executed when the user places his mouse over the image.
this.src = "path/to/other/image.ext"
very simply, this says we want to set the src attribute of this element to path/to/other/image.ext
And then we use the DHTML attribute onmouseout to change the image back to the original image when we mouse off it.
Last edited by NancyJ; 04-08-2006 at 03:43 AM.
Okay, maybe I shouldn't admit this, but I look at sites and find what I like and then go look at the source code. Sometimes you can find the source of the code, like the movie slide show on www.CodeLifter.com that I use on my sites, which I found in this manner. There are all kinds of sites that have examples of code to use at no cost. Just search in google.
|Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)|
|Thread||Thread Starter||Forum||Replies||Last Post|
|REVIEW: One-Click - Automated Instant Art Effects - Volume 1||DannyRaphael||Photo-Art Resources||2||05-20-2007 01:02 PM|
|Artistic Edge Effects||gmitchel||Photo Retouching||0||11-06-2005 04:31 PM|
|Free Action Set for Adding Diffuse Glow and Soft Focus Effects||gmitchel||Photo Retouching||4||10-30-2005 12:03 PM|
|Mend Tool - Patron Info button error.||jimlay||Hidden Power Support||6||02-29-2004 12:49 PM|
|Mouse Chronicles Vol 29||chris h||Hardware||1||11-30-2001 12:18 PM|