Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 134
  • Last Modified:

How do change an image when user moves cursor over it?

This is probably easy buy I'm in a real rush so I'm counting on my experts! I created a gif file that I use for a button. When the user cursors over it, the cursor changes to the hand icon. I would also like to display a different gif file. (The gif file is actually just an image of text, so I want to display a gif file that has the text a different color - I'm using gifs instead of text because I'm using a non-standard font.) How do I do that?

I'm using Dreamweaver, ColdFusion and HTML.

Here's the current code for my button:

 <img src="/lookfeel/buttons/search1.gif" border="0" usemap="#Mapsearch" />
                <map name="Mapsearch" id="Mapsearch">
                  <area shape="rect" coords="0,0,240,40" href="/apps/search/search.cfm" alt="Search Recipes"/>
                </map>
0
alicia1234
Asked:
alicia1234
  • 2
  • 2
1 Solution
 
BraveBrainCommented:
Basically:
<img src="/lookfeel/buttons/search1.gif" border="0" usemap="#Mapsearch" onmouseover="this.src = 'newbutton.gif' " onmouseout="this.src = '/lookfeel/buttons/search1.gif' " />

or by using other functions or vars in the statement
i.e. your other gif is /lookfeel/buttons/search2.gif
<img src="/lookfeel/buttons/search1.gif" border="0" usemap="#Mapsearch" onmouseover="this.src = this.src.replace('1','2')" onmouseout="this.src = this.src.replace('1','2')" />

The advantage of using the second example is if i.e. all your text images has a name with a 1 in it that should be replaced with a 2 for rollover, you don't have to change anything in the event handler for the other images.
0
 
alicia1234Author Commented:
Excellent! Thank you so much! ;-)
0
 
BraveBrainCommented:
Glad to help.  Thanks for the grade and points :)
0
 
alicia1234Author Commented:
No problem. I've already implemented what you said and it looks great. ;-)
0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now