Jump to content

Image mapping


tissot

Recommended Posts

heres the code.

<head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><title>Untitled Document</title><script LANGUAGE="JavaScript">Image1= new Image(133,317)Image1.src = "file:///H|/Unit%2031%20-%20Website%20Development/Pablo-Assignment/Test/Test2/buttons.JPG"Image2 = new Image(133,317)Image2.src = "file:///H|/Unit%2031%20-%20Website%20Development/Pablo-Assignment/Test/Test2/home.JPG"function SwapOut() {document.imageflip.src = Image2.src; return true;}function SwapBack() {document.imageflip.src = Image1.src; return true;}</SCRIPT> </head><body><img src="file:///H|/Unit%2031%20-%20Website%20Development/Pablo-Assignment/Test/Test2/buttons.JPG" width="133" height="317" alt="buttons" usermap="#buttons"><map id="buttons" name="buttons"><area shape="circle" coords="64,65,32" alt="Home" HREF="index.html" onMouseOver="SwapOut()" onMouseOut="SwapBack()"><IMG NAME="imageflip" SRC="file:///H|/Unit%2031%20-%20Website%20Development/Pablo-Assignment/Test/Test2/home.JPG" WIDTH="133" HEIGHT="317" BORDER="0"/></map></body></html>

I used some javascript code to change the image only if I hover around the specific area on the image, but it doesnt work.. am l doing something wrong?the correct image mapping code is like this:

 <AREA SHAPE="RECT" COORDS="340,0 397,18" HREF="/search.cgi">

In HTML speaking, I dont want my image to be linked, only image rollover. So i changed the "HREF" to something like SRC but that didnt work as well.

Link to comment
Share on other sites

If you don't want the image to be linked, you probably don't want to use an imagemap. If you just want images to change on hover, then it's probably easier to do with normal images with javascript changing the src on hover.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...