Jump to content

Help with image maps/js


djkdra
 Share

Recommended Posts

Hey guys and gals, got a problem again :).. i got a image, witch is made with PS and in that image, it is overlayed 7images to go red on hover on image maps. here is what i got now: (just added the one overlayer to start with)

<img src="bybilder/byen.gif" width="646" height="596" border="0" usemap="#Map" /><map name="Map" id="Map"><area shape="poly" coords="35,284" href="#" /><area shape="poly" coords="223,592,219,581,225,563,186,518,165,526,159,526,142,509,124,509,110,503,94,492,81,474,51,457,47,447,27,428,4,437,2,456,2,594" onmouseover="this.src='bybilder/byen01.gif'" onmouseout="this.src='bybilder/byen.gif'" href="#" /></map>

Remember that the this function here, is totally wrong, and reason its there is for you to easyer understand what i want.- DJKDra

Link to comment
Share on other sites

Sorry man... this is probably not happening the way you want.First, areas don't have a "src" property, so modifying this.src on your <area> won't do you much good.You can try modifying the style property of the area (this.style.background) on mouseover and mouseout, but I don't think that's going to do much good either. I believe the background attribute of an area is ignored.There are a ton of ways to solve this problem, though. Don't struggle too hard to make this one way work. Search the forum for image rollovers and you'll find a ton.

Link to comment
Share on other sites

Dont know if you really read what i wrote as you said it aint happening the way i want... the this function is there to show you what i need from you guys, the thing i want is probz an get element by id function to registrer the name of the map then send it to a js function on mouseover and on mouseover the function changes a background picture and re-changes on mouse out therefore its the simplest way for me to show you the idea with a this function..If i just wanted a hover, it whould not be a problem at all as i actually can do the basics of css/html.But thanks for answer.- DJKDra.

Link to comment
Share on other sites

Found the right code :

<script language="JavaScript"><!-- if (navigator.appVersion.indexOf("2.") != -1){		check = false;		}if ((navigator.appVersion.indexOf("3.") != -1) && (navigator.appName.indexOf("Explorer") != -1)){		check = false;		}else {		check = true;		}origimage = new Image();origimage.src = "bybilder/byen.gif";image1on = new Image();image1on.src = "bybilder/byen01.gif";image2on = new Image();image2on.src = "bybilder/byen02.gif";image3on = new Image();image3on.src = "bybilder/byen03.gif";image4on = new Image();image4on.src = "bybilder/byen04.gif";image5on = new Image();image5on.src = "bybilder/byen05.gif"; image6on = new Image();image6on.src = "bybilder/byen06.gif";image7on = new Image();image7on.src = "bybilder/byen07.gif";function imageon(name)   {		document.altimg.src = eval(name + "on.src");}function imageoff(name)  {		document.altimg.src = eval(name + ".src");}function on(name)  {		if (check == true){		imageon(name);		}}function off(name)  {		if (check == true){		imageoff(name);		}}// -->

Might be other in need of it so here it is :)..- DJKDra

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
 Share

×
×
  • Create New...