• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 270
  • Last Modified:

Mouse Over:

Hi everyone,

I have a list of items on my web site:

item1   item2   item3  Image1

These all items are link. what I am trying to do that whenever mouse is over the item1 - like to show the item1's image in Image1. same for item2, item3.

How do I do that?

Thanks all.

I am very basic with script.
1 Solution
Saqib KhanSenior DeveloperCommented:
Lets say this is your image

<img name="img1" src="img.gif">

and here is your Link

<a href="item2.asp" onMouseover="document.images[img1].src='item1_IMG.gif'" onMouseout="document.images['img1'].src='img.gif'">Item1</a>

for item3

<a href="item3.asp" onMouseover="document.images[img1].src='item3_IMG.gif'" onMouseout="document.images['img1'].src='img.gif'">Item3</a>

- so we gave our main image a name
- on Mouseover we referenced to that image, and supplied the path of new image
- on Mouseout we default the main image back to its orignal state.
neonlightsAuthor Commented:
Amazing, Now, I want to learn .... great solution - Thank you very much again. I am learning...

Thanks again

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

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