RetouchPRO

Go Back   RetouchPRO > Business > Work/Jobs
Register Blogs FAQ Site Nav Search Today's Posts Mark Forums Read


Work/Jobs Talk about the business side of things. Advice, questions, inspiration, and moral support

Mouse-over effects, more info

Reply
 
Thread Tools
  #1  
Old 04-08-2006, 02:11 AM
aylaah's Avatar
aylaah aylaah is offline
Senior Member
 
Join Date: Jan 2006
Location: Newcastle NSW Australia
Posts: 106
Mouse-over effects, more info

I'm considering putting up both a mouse over and a side by side on my website, but as a web-developer novice I am trying to find out how. I have seen a few threads where it is mentioned, and have seen it attributed to being done with Java, but how? Is there a program that does it automatically? Or is it a bit too much for a novice used to using site builders?

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
Reply With Quote top
  #2  
Old 04-08-2006, 03:03 AM
Verywierd's Avatar
Verywierd Verywierd is offline
Senior Member
 
Join Date: Dec 2005
Posts: 252
I usually use Dreamweaver or Namo to do it but try this:

http://www.htmlcodetutorial.com/imag...amsupp_59.html
Reply With Quote top
  #3  
Old 04-08-2006, 04:33 AM
NancyJ's Avatar
NancyJ NancyJ is offline
Senior Member
 
Join Date: Jun 2004
Posts: 729
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.

Now the javascript...
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.

HTH

Last edited by NancyJ; 04-08-2006 at 04:43 AM.
Reply With Quote top
  #4  
Old 04-08-2006, 08:56 AM
aylaah's Avatar
aylaah aylaah is offline
Senior Member
 
Join Date: Jan 2006
Location: Newcastle NSW Australia
Posts: 106
Yay!



to both of you!
Reply With Quote top
  #5  
Old 04-10-2006, 06:09 PM
Nanls's Avatar
Nanls Nanls is offline
Senior Member
 
Join Date: May 2005
Location: REDONDO BEACH, Ca
Posts: 567
Wink

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.

~Nancy~
______________________________________________________

www.fixthepixs.com
www.datepixs.com
Reply With Quote top
Reply

  RetouchPRO > Business > Work/Jobs


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
REVIEW: One-Click - Automated Instant Art Effects - Volume 1 DannyRaphael Photo-Art Resources 2 05-20-2007 02:02 PM
Artistic Edge Effects gmitchel Photo Retouching 0 11-06-2005 05:31 PM
Free Action Set for Adding Diffuse Glow and Soft Focus Effects gmitchel Photo Retouching 4 10-30-2005 01:03 PM
Mend Tool - Patron Info button error. jimlay Hidden Power Support 6 02-29-2004 01:49 PM
Mouse Chronicles Vol 29 chris h Hardware 1 11-30-2001 01:18 PM


All times are GMT -6. The time now is 07:29 AM.


Powered by vBulletin® Version 3.8.4
Copyright ©2000 - 2017, Jelsoft Enterprises Ltd.
SEO by vBSEO ©2011, Crawlability, Inc.
Copyright © 2016 Doug Nelson. All Rights Reserved