By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
435,039 Members | 1,831 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 435,039 IT Pros & Developers. It's quick & easy.

Change foreground/layer color on AREA mouseover??

P: n/a
Hi, all! I have an imagemap of a floor of offices. I have various
events and an onclick function working just fine, but I'd like to be
able to change the color of the region being hovered over. Is there
any way to do this? Presumably I could just read the coords of the
region, create a floating layer dynamically, and change the color, no?
Unfortunately, I can't manage to read the coords property, and I'm not
entirely certain how to build the floating layer.

Any suggestions? No, I don't want to use Flash for this... ;-)

Thanks!
Jack

Jan 6 '06 #1
Share this Question
Share on Google+
2 Replies


P: n/a
sp**********@hotmail.com escreveu:
Hi, all! I have an imagemap of a floor of offices. I have various
events and an onclick function working just fine, but I'd like to be
able to change the color of the region being hovered over.


You should post a link to help people understanding what you've done =)

Are you using those mapped anchors? If yes, I think you'll have to keep
the origin point coords somewhere or parse the coords and shape
properties... If this is build dinamically, you can parse once and
store in your database... Then you'll just need to place an image with
the hovering effect over the real image... But this image will "hide"
the link haha, so you'll have to emulate the link onclick :)

Sorry for not helping too much ;]
--
Jonas Raoni Soares Silva
http://www.jsfromhell.com

Jan 6 '06 #2

P: n/a


Try
<div id="overlayer" style="position: absolute;display: none"> give
this div some width/height and a tone of gray or whatever color you
need as overlay</div>
<area .... onmouseover="YOURFUNCTION(this,'block')"
onmouseout="YOURFUNCTION(this,'none')">
function YOURFUNCTION(el,sView) {
myoverlayer=document.getElemetnById('overlayer');
myoverlayer.style.left=el.offsetLeft;
myoverlayer.style.top=el.offsetTop;
myoverlayer.style.display=sView;
}

Danny
Jan 8 '06 #3

This discussion thread is closed

Replies have been disabled for this discussion.