area border

Mudas · Mar 24, 2005

Hello

I'm trying find some solution but I even don't know if it's possible.
I have a map of some region and using the area I can enlarge it.
But I want to set the area border=1 when mouse is on and hide border
when is out. – the user must know which region will be enlarge.

I know that it's possible when I'll divide my image to smallest, or if
I use flash but I want to make it in html, css or java. Mayby it's
possible using layers ?? Have you any idea ??

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

<img border="0" src="Photo/MainMap.jpg" alt="" usemap="#Norway">
<map name="Norway">
<area shape="rect" coords="37, 25, 85, 82" href="MainM1.htm"
alt="powieksz region" onmouseover=???????? onmouseout=?????????>
</map>

Regards
Mudas

bne · Mar 24, 2005

Hi Mudas,

...I want to make it in html, css or java.

Before some other pedant gets in there first: javascript is not java
<http://jibbering.com/faq/#FAQ2_2>

You're probably best ditching the image map idea and going for a pure
DHTML solution:

<div style="position:relative;top:0px;left:0px;">
<img border="0" src="Photo/MainMap.jpg"
style="position:absolute;top:0px;left:0px;">
<div id="Norway"
style="position:absolute;left:37px;top:25px;width:48px;height:57px;"
onmouseover="show('Norway');"
onmouseout="hide('Norway');"><a href="MainM1.htm"><img
src="nothing.gif" border="0" style="width:48px;height:57px;"
/></a></div>
</div>

<script type="text/javascript">

function show(id)
{
var el = document.getElementById(id);
el.style.borderWidth = '1px';
el.style.borderColor = '#000';
el.style.borderStyle = 'solid';
}

function hide(id)
{
var el = document.getElementById(id);
el.style.borderWidth = '0px';
}

</script>

nothing.gif is a transparent filler image.

obviously this only allows for rectangles - setting the visibility of a
transparent gif that's in the outline of the shape might be another way
round it of course.

ben

Help with Visual Lightbox: Scripts	2	May 3, 2023
onClick not firing for an ImageMap Area	6	Jun 5, 2008
Working on mobile css menu with plenty of frustration!	2	Dec 29, 2022
need help on highlighting image map area	1	Apr 16, 2005
Help with my responsive home page	2	Dec 14, 2022
Coding problem	13	Aug 22, 2013
onmouseover javascript for image map areas	4	Dec 21, 2006
Image map not working in FireFox	5	Jun 13, 2007

area border

Mudas

bne

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads