Link to home
Start Free TrialLog in
Avatar of ac6649
ac6649

asked on

highlight imagemap

Is there any way to highlight an imagemap, ie someway of showing what area of the imagemap has been selected? Basically I have an imagemap in one frame that shows info in another frame, and I want a way of showing what was clicked on the imagemap.

I can't use java or flash, as I know the co-ordinates from the image map would it be possible to put some div on top of the image map?

thanks
Andy
ASKER CERTIFIED SOLUTION
Avatar of weed
weed
Flag of United States of America image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of ac6649
ac6649

ASKER

I have done this myself by dynamically resizing aa translucent image and positining over the appropiate area of the imagemap based on the area coords, unfortunately only works for rectangles at the moment
Exactly, you might be able to do it with dhtml etc but then youre getting into an area where not all browsers will be able to see it and different browsers will render it differently.
I saw an applet that will do it for you..here is the link

http://www.imint.com/demos/ipop/demo5603.htm

I think this does what you want
Again, thats not an image map, thats a Java Applet. And again it increases your page load time and decreases the number of users who can view it. You would be better off creating a rollover the old fashioned way.
weed: that applet is less than 40k, and most people in the universe now have a browser that is 4+. so it may increase load time by 1 second but if he is using this as a primary image on the homepage why should it matter if it takes one more second to load. it does the job..sometimes you need to sacrifice that 1 second to do the job properly.
There are millions of people who use the web every day. If just 1% of those people are using a browser that doesnt support Java that's still alot of people. And i guarantee you that there are more than 1% using an old browser.
try this

http://www.24fun.com/downloadcenter/utilmarkbycolor2/utilmarkbycolor2.html

but it not work in Netscape

Regards
Oxeri
Hi Oxeri,

Welcome to Experts Exchange.

It is hard for me to judge how much involvement you've had with Experts Exchange since you joined in January, but I see that you have asked very few questions and seem to have little experience as an expert.

I would like to point out that the etiquette of this and many other topic areas is to post comments only.  There are a number of reasons for this.  It allows the question to stay in the high traffic "Questions awaiting answers" area instead of the "Locked Questions" area which experts frequent less often;  it promotes teamwork and debate.  Note that the questioner can accept any comment as an answer, so there is no predjudice against your answer.

The site used to have a "revert answer to a comment" feature.  That feature was lost in the last change to the site software, however, I can change your answer to a comment if you think posting as an answer was a mistake.  Please let me know.  

If you have any questions or comments about what I have just told you please feel free to post them in the Community Support topic area [ https://www.experts-exchange.com/jsp/qList.jsp?ta=commspt ]as a new zero point question.

Lunchy
Friendly Neighbourhood Community Support Moderator
Lunchy@experts-exchange.com
To highlight the image you could create the same image with several highlights.  Then through the use of javascript or vbscript you could change out the images dependant on what link of the image map was selected.
This is fairly simple to do using javascript or some other scripting language.

Good Luck
Jeff
Avatar of ac6649

ASKER

I am not able to create multiple images as i am already dynmically creating the images and it would take to long to create all the possible combinations, similarly that is why java and flash aren't suitably as I already have my picture generation working.

I have a half solution working as I described above but it is not perfect, I really wanted some way of applying filter to selected areas of the picture, the link provided by  Oxeri  does that but again it requires changingthe way i generate the image.
I've done something kinda similar...

Took an average sidemenu that was about 40 images... I wanted to make that 2 images and the mouseover works via imagemap... It's JavaScript intensive though...  Works in both IE and NS... HOWEVER I strongly recommend making seperate pages for users to print...

Be warned of using other layers on the page...  You have to play with it so as not to have them appearing in wierd places.

I need to work some more on it and it is really db/asp intensive however if you want to look at it go to

http://www.passport-america.com 

then view source (it's all on the same page) and modify it. If you use it though just leave credit (plus I'd like to see what someone else did with it)
there are several ways to approach this.  maulti-image roll-overs were suggested, but those opviously won't work in this case. you could try filters, but only IE supports them.
the only half-way decent solutions that _I_ can think of are:
- place a partially transparent gif over your image to bracket it (think tooltip over the image with a hole in it)(you could do highlighting if you covered parts of the image with brighter colors)..maybe you could have it look like non-moving 'ant's or a lasso tool.

- or you could consider only actually generating only part of the effect as an image map.
consider, for example, an image map with four areas, vertically for imaginations sake.  I am thinking somewhat icon-like or button-like. to the left (or right or both), you bracket it with images that highlight..arrows , contrasting color etc..  so think 1 column, narrow with four vertical cells holding the left half of a button.  Each cell holds an image that changes with mouseover over a portion of the image map immediately its right.  The image map would rowspan 4.  If everything was consitant enough you could get away with 3 images..the image map, the default view of the highlight area and a highlighted version of the highlight version.

ac6649:
why does dynamically resizing a translucent image and positioning over the appropiate
area of the imagemap based on the area coords,  only work for rectangles at the moment?
(the resizing might be teh problem)
..a transparent gif could look like any shape...sort of like tracing paper
 ..or perhaps cooler, if you are generating a gif imagemap..then perhaps you could have that be transparent and place things _behind_ it.(this is such a neat idea maybe I'll mess with this weekend)

Hello,

This question has been open for quite a while now and needs to be wrapped up.

Please do NOT accept this comment as an answer, as I am simply trying to alert those involved that the question is still open.

If any of the experts could come back and post any suggestions as to how they feel this could be wrapped up (delete, 0 PAQ, award points, etc), I'm sure the moderators would appreciate it.

Thank you,

BRUNO
IF NO EXPERTS PROVIDE INPUT HERE I WILL ASSUME NO ONE CARES ABOUT THIS QUESTION AND IT SHOULD BE DELETED.
It comes down to the fact that there is no simple/compatible solution without slicing it up, and then its no longer an imagemap.
weed, that's all well and good, but how should this question be handled?

thanks,


BRUNO
Not sure. Its one of those where the answer he wants, isnt the answer that exists.
In my book, "you can't do that" is a perfectly valid answer, whether the Asker likes the answer or not.

Force-accepted by
Netminder
CS Moderator