473,734 Members | 2,567 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

How to get MAP to work with mouseover

The following passes the test as valid, and the mouseover for the six
indicated areas also work.
I need various areas to link to another page, including the six
mentioned.
However either the MAP works by itself, or the below mouseover works,
but not both.
Would someone be kind as to lend some help?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Stripp er wells and production</title>
<style type="text/css">
#centerImage {text-align: center;}
</style>
</head>

<body>
<div>
<img src="Usa52.gif" alt="USA map" usemap="#USMap"
style="position : top: 2px; left: 4px; height: 431px; width: 760px;
border-style:none" />
</div>

<div style="position : absolute; top: 64px; left: 264px; "
<img style = "" ALT=""
src='USblk.gif' onmouseover="th is.src='USred.g if';"
onmouseout="thi s.src='USblk.gi f';" >
</div>
<div style="position : absolute; top: 175px; left: 623px; "
<img style = "" ALT=""
src='Ired.gif' onmouseover="th is.src='Iblk.gi f';"
onmouseout="thi s.src='Ired.gif ';" >
</div>
<div style="position : absolute; top: 150px; left: 444px; "
<img style = "" ALT=""
src='IIred.gif' onmouseover="th is.src='IIblk.g if';"
onmouseout="thi s.src='IIred.gi f';" >
</div>
<div style="position : absolute; top: 334px; left: 372px; "
<img style = "" ALT=""
src='IIIred.gif ' onmouseover="th is.src='IIIblk. gif';"
onmouseout="thi s.src='IIIred.g if';" >
</div>
<div style="position : absolute; top: 140px; left: 299px; "
<img style = "" ALT=""
src='IVred.gif' onmouseover="th is.src='IVblk.g if';"
onmouseout="thi s.src='IVred.gi f';" >
</div>
<div style="position : absolute; top: 166px; left: 179px; "
<img style = "" ALT=""
src='Vred.gif' onmouseover="th is.src='Vblk.gi f';"
onmouseout="thi s.src='Vred.gif ';" >
</div>

<div>
<map id="Usa52" name="Usa52">
<area shape="rect" alt="US" coords="264,64, 288,79"
href="gUS.htm" title="US" >
<area shape="poly" alt="CA" coords="157,164 ,151,168,151,17 3,148,182,148,1 89,
153,213,159,216 ,156,222,157,22 5,159,228,162,2 29,162,235,161, 239,166,254,169 ,
254,167,262,171 ,269,177,270,17 7,272,181,276,1 84,276,184,278, 185,280,191,280 ,
196,295,219,297 ,225,281,224,26 5,184,209,189,1 71"
href="gCA.htm" title="CA" >
<area shape="default" nohref="nohref" alt="" >
</map>
</div>
</body>
</html>
Apr 11 '06 #1
26 2291
Robert Baer <ro********@ear thlink.net> wrote:
However either the MAP works by itself, or the below mouseover works,
but not both.


Please specify what you mean by "works" and its opposite, and please provide
URLs for the two versions you have created. There's little point in
everyone's trying to reconstruct the problem when you could simply have
posted the URLs.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html

Apr 11 '06 #2
Jukka K. Korpela wrote:
Robert Baer <ro********@ear thlink.net> wrote:

However either the MAP works by itself, or the below mouseover works,
but not both.

Please specify what you mean by "works" and its opposite, and please provide
URLs for the two versions you have created. There's little point in
everyone's trying to reconstruct the problem when you could simply have
posted the URLs.

Err...i presented the code and stated that the MAP prevents the
mouseover section above it from working.
URL?
Pray tell me where i should post such a theoretical webpage, when the
code was given.
Apr 11 '06 #3
Robert Baer <ro********@ear thlink.net> wrote:
Err...i presented the code and stated that the MAP prevents the
mouseover section above it from working.
You didn't say what really happens.

And you presented a code snippet, not a URL.
URL?
Indeed.
Pray tell me where i should post such a theoretical webpage, when the
code was given.


On the World Wide Web. If you are asking for a free help, the least you
should do is your homework, including setting up a demo page so that others
won't have to construct a real case for you.

If you don't know how to create web pages, consider consulting a primer.

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html

Apr 11 '06 #4
Jukka K. Korpela wrote:
Robert Baer <ro********@ear thlink.net> wrote:

Err...i presented the code and stated that the MAP prevents the
mouseover section above it from working.

You didn't say what really happens.

And you presented a code snippet, not a URL.

URL?

Indeed.

Pray tell me where i should post such a theoretical webpage, when the
code was given.

On the World Wide Web. If you are asking for a free help, the least you
should do is your homework, including setting up a demo page so that others
won't have to construct a real case for you.

If you don't know how to create web pages, consider consulting a primer.

Let me get this straight.
I presented a complete HTML document, and you claim it is a "snippet".
Then you want me to find somewhere on the WWW that does not exist at
this moment, to place that code.
Pray tell, what good will that do?
Apr 12 '06 #5
Jukka K. Korpela wrote:
Robert Baer <ro********@ear thlink.net> wrote:

Err...i presented the code and stated that the MAP prevents the
mouseover section above it from working.

You didn't say what really happens.

And you presented a code snippet, not a URL.

URL?

Indeed.

Pray tell me where i should post such a theoretical webpage, when the
code was given.

On the World Wide Web. If you are asking for a free help, the least you
should do is your homework, including setting up a demo page so that others
won't have to construct a real case for you.

If you don't know how to create web pages, consider consulting a primer.

Oh, i forgot...i did mention what happens - *twice*.
Apr 12 '06 #6
Here are the URLs that show only one (MAP or onMouseOver) works, and
not both.
If anyone can tell me how to get both to work, i would appreciate it.
http://oil4lessllc.com/omy2.htm
http://oil4lessllc.com/sw4.htm

Please no bitching that this is a retail site; it was the only way i
could get the (posted) code to a URL site.
Apr 12 '06 #7
Robert Baer wrote:
Here are the URLs that show only one (MAP or onMouseOver) works, and
not both.
If anyone can tell me how to get both to work, i would appreciate it.


Well, after your pointless babbling and even insults, I'm not interested
any more. Hope this helps. Have a nice day. Better luck^H^H^H^Hbeh avior
next time.
Apr 12 '06 #8
VK
OP:
<full problem description>
Would someone be kind as to lend some help? <full HTML code posted>

Mr. Korpela: Please specify what you mean by "works" and its opposite,
and please provide URLs for the two versions you have created.
<snip>

OP: Here are the URLs that show only one (MAP or onMouseOver) works,
and not both.
Mr.Korpela: Well, after your pointless babbling and even insults, I'm not interested
any more. Hope this helps. Have a nice day. Better luck^H^H^H^Hbeh avior
next time.


Mr. Korpela: my sorry duty is to inform you that you are currently
acting like a complete asshole - without any asterix.

To OP: in the posted links one doesn't have usemap, another one doesn't
have rollover block: thusly the difference in the behavior is
completely sustained by the code.

The original code posted here does work - I checked it with random
images on my side. As a side note: I would suggest to specify widht and
height for your div's. Your presumption that they always will have the
minimum needed size to accomodate the content is reasonnable but not
always true.

Your code must be not working for some subtle typo you've made while
copying and pasting and not represented here.

Here the minimum proof of concept (hover the yellow div, then try
California):

<html>
<head>
<title>Untitl ed Document</title>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
</head>

<body>
<img src="Usa52.gif" width="760" height="431" border="0"
usemap="#map1">
<map name="map1">
<area shape="rect" coords="139,171 ,216,303"
href="http://www.google.com" >
</map>
<div onmouseover="th is.innerHTML='f oo';"
onmouseout="thi s.innerHTML='ba r';" id="Layer1"
style="position :absolute; width:170px; height:78px;
background-color:#FFFF00; z-index:1; left: 111px; top: 118px"></div>
</body>
</html>

Apr 12 '06 #9
VK wrote:
Mr. Korpela: my sorry duty is to inform you that you are currently
acting like a complete asshole - without any asterix.


And I'll stand up here to defence Jukka. He does over-react sometimes,
but this one's justified.

Post the URLs, make things easy for the people who you're hoping to
help you. We don't _have_ to do this you know, and I'm sure we're all
busy.

Apr 12 '06 #10

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

8
78169
by: al | last post by:
Hi, I've been trying to create a image mouseOver effect using CSS - is this possible? Or will I have to use DIV tags or something along those lines? I've tried a number of things - the code below will work for the border no problem, but I can't seem to get the SRC to work - is this not an option in CSS?
3
1778
by: richk | last post by:
For some reason when I add additional buttons a 3rd button and beyond i cant get the effect to work and I get errors...I cant understand why... <SCRIPT LANGUAGE = "javascript"><!-- if (document.images) { // Active Images img1on = new Image(); img1on.src = "button1_on.jpg";
4
3007
by: murrayatuptowngallery | last post by:
I have looked at some mouseover/ sound object scripts and can't get them to work. Most were more complex than needed and introduced several new parameters for me. I found a simple pair of html code segments that accomplish display of an image and automatic 'display' (playback) of a .wav file, and apparently are usable for both IE and NS, " <object height="100%" width="100%"
2
5174
by: Mitch | last post by:
I am hosting a web browser ctl in a container that implements the IDocHostUIHandler interface. I'm using this to control the context menu.This works fine. Then, I added a mouseover event to the document in the documentComplete event handler. When I add this event handler, I loose all other navigation functions in the browser! right click, left click, it's all dead. (The mouseover works though)
6
4896
by: scottyman | last post by:
I can't make this script work properly. I've gone as far as I can with it and the rest is out of my ability. I can do some html editing but I'm lost in the Java world. The script at the bottom of the html page controls the form fields that are required. It doesn't function like it's supposed to and I can leave all the fields blank and it still submits the form. Also I can't get it to transfer the file in the upload section. The file name...
5
2410
by: JB | last post by:
I am struggling to figure out a way to allow one element to be dragged, but still capture 'mouseover' events on other elements. I've created a simple example to demonstrate what I mean: http://gerromorpha.cs.uoregon.edu/moveAndOver.html (The above link is only meant for Windows/Firefox.) It's not much code, but it's probably too much to paste here. The gist of it is, when a user clicks on element #1, I attach
11
2979
by: Robert Baer | last post by:
The following passes the test as valid, and the mouseover for the six indicated areas also work. I need various areas to link to another page, including the six mentioned. However either the MAP works by itself, or the below mouseover works, but not both. Would someone be kind as to lend some help? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
2
4025
by: Amy | last post by:
<style> div.helpBtn{ font:bold 73% verdana; color:#995F8D; text-align:left; width:79px; height:24px; margin:0px; padding: 5px 0px 0px 27px; background: url(/jsp/images/pms/housekeeping/helpBtn_off.gif) no-repeat; } div.helpBtnOn{ font:bold 73% verdana; color:#BB59DE; text-align:left; width:79px; height:24px; margin:0px; padding: 5px 0px 0px 27px; background: url(/jsp/images/pms/housekeeping/helpBtn_on.gif) no-repeat; cursor:pointer; }...
3
3321
by: lofty00 | last post by:
hello, sorry about the repost - I've been posting to several groups and I've decided it's better to make a single repost to all of them rather than an extra post in each. I've been trying to work out why I can't get the image maps to work in IE6 on a page I'm working on (which is now working in firefox). I've written the page below as a test case. It's now refusing to work in Firefox either, and I can't see anything wrong with it so...
3
3370
by: apurvaG | last post by:
Hi All, I am applying some xslt template on a XML file to generate the HTML. This HTML has several <DIV> tags with mouseover and mouseout event associated to them. So if i do mouseover on a <DIV> it gets highlighted. And when I do mousout on a <DIV> highlight effect goes off. Its is working perfectly if the DIV has plain text. For example <DIV>This is some text inside a div</DIV>.
0
8776
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
9182
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
8186
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
6735
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
6031
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...
0
4550
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
0
4809
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
2
2724
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
3
2180
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.