creating image maps with dom not working in IE 7

**GTalbot** · Jul 20 '08, 06:15 AM

Re: creating image maps with dom not working in IE 7

On Jul 19, 11:54 pm, "Ryan Knopp" <ryan<-delete->@theknopps.com >
wrote:

This is an update from a previous post, I just simplified the code.
>
It seems that I can't get the image map to work with IE7. The page is
located herehttp://www.theknopps.c om/test.htmland the source below.
>
I can't seem to figure out why IE7 won't recognize the image map. Thanks
for your help
>
Ryan
>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Hello</title>
<script type='text/javascript'>
window.onload = function(){

I believe you should use

<body onload="init(); ">

so that once all the elements of the HTML document are loaded in
memory, only then, should you start your script. As written, you start
your script function just when the window loads itself. Window and
body node are 2 distinct, separate objects which load asynchronously.
The mistake you do is often encountered and many browsers are forgiven
but, again, best is to start your function only and only when all
elements of the body node are loaded in memory.

>
var div = document.getEle mentById("blah" );
>
var img = document.getEle mentById("img") ;
if(!img){
img = document.create Element("img");
img.setAttribut e("src", "goodies/stuff/disco_stu.jpg") ;

Avoid setAttribute in IE 7: it's known to be buggy, unreliable, not
working. Use DOM 2 HTML attributes instead. Example given:

img.src = "goodies/stuff/disco_stu.jpg";

Document Object Model HTML

http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-87762984

What you are trying to do in IE 7 will only start to work in IE 8
final release.

img.setAttribut e("id", "i-4-4");

img.id = "i-4-4";

Document Object Model HTML

http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-63534901

img.setAttribut e("usemap", "#m-1-1");

img.useMap = "m-1-1";

Document Object Model HTML

http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-35981181

img.setAttribut e("alt", "");

img.alt = "";

div.appendChild (img);
}
imgmap = document.getEle mentById("m-1-1");
if(!imgmap){
var imgmap = document.create Element("map");
imgmap.setAttri bute("id", "m-1-1");
imgmap.setAttri bute("name", "m-1-1");
>
var area = document.create Element("area") ;
area.setAttribu te("alt", "");

area.alt = "";

Document Object Model HTML

http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-26019118

area.setAttribu te("href", "http://google.com");
area.setAttribu te("shape", "circle");
area.setAttribu te("coords", "20,20,10") ;

area.href = "http://www.google.com/";
area.shape = "circle";
area.coords = "20, 20, 10";

Document Object Model HTML

http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-26019118

Gérard
--
Internet Explorer 7 bugs: 156 bugs so far

Bugs in MSIE 7 for Windows

http://www.gtalbot.org/BrowserBugsSection/MSIE7Bugs/

Internet Explorer 7 bugs: 130 bugs so far

Bugs in MSIE 8 for Windows

http://www.gtalbot.org/BrowserBugsSection/MSIE8Bugs/

**Thomas 'PointedEars' Lahn** · Jul 20 '08, 10:55 AM

Re: creating image maps with dom not working in IE 7

GTalbot wrote:

On Jul 19, 11:54 pm, "Ryan Knopp" <ryan<-delete->@theknopps.com >
wrote:

OP:

Your From header constitutes a violation of Internet Standards and is
disregarding Netiquette. I will therefore killfile people using this
header from now on.

<http://www.apps.ietf.o rg/rfc/rfc1036.html>
<http://www.apps.ietf.o rg/rfc/rfc2822.html#se c-3.4>
<http://www.apps.ietf.o rg/rfc/rfc822.html#sec-6>
<http://en.wikipedia.or g/wiki/Netiquette>
<http://www.interhack.n et/pubs/munging-harmful/>

>[...]
>It seems that I can't get the image map to work with IE7. The page is
>located herehttp://www.theknopps.c om/test.htmland the source below.
>>
>I can't seem to figure out why IE7 won't recognize the image map. [...]
>>
> img.setAttribut e("usemap", "#m-1-1");

>
img.useMap = "m-1-1";
>
http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-35981181

| `useMap' of type `DOMString'
| Use client-side image map. See the <usemap attribute definitionin
| HTML 4.01.

,-<http://www.w3.org/TR/1999/REC-html401-19991224/struct/objects.html#ad ef-usemap>
|
| usemap = uri [CT]
^^^
| This attribute associates an image map with an element. The image map is
| defined by a MAP element. The value of usemap must match the value of
| the name attribute of the associated MAP element.

The Specification is somewhat ambiguous here. What is meant is

usemap="#m1-1-1"

in (X)HTML and therefore

img.useMap = "#m-1-1";

in script code.

> img.setAttribut e("alt", "");

>
img.alt = "";

,-<http://www.w3.org/TR/2003/REC-DOM-Level-2-HTML-20030109/html.html#ID-95636861>
|
| `alt' of type `DOMString'
| Alternate text for user agents not rendering the normal content of this
| element. See the alt attribute definition in HTML 4.01.

,-<http://www.w3.org/TR/1999/REC-html401-19991224/struct/objects.html#h-13.6.1>
|
| The `alt' attribute specifies alternate text that is rendered when the
| image cannot be displayed (see below for information on <how to specify
| alternate text>).

As the image has meaning as *content* here (instead of being there purely
for layout purposes), I think it should not have an empty `alt' attribute value.

var area = document.create Element("area") ;
area.setAttribu te("alt", "");

>
area.alt = "";
>
http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-26019118

| `alt' of type `DOMString'
| Alternate text for user agents not rendering the normal content of this
| element. See the <alt attribute definitionin HTML 4.01.

,-<http://www.w3.org/TR/1999/REC-html40....html#adef-alt
|
| alt = text [CS]
| For user agents that cannot display images, forms, or applets, this
| attribute specifies alternate text. The language of the alternate text
| is specified by the lang attribute.
|
| Several non-textual elements (IMG, AREA, APPLET, and INPUT) let authors
| specify alternate text to serve as content when the element cannot
| be rendered normally. Specifying alternate text assists users without
| graphic display terminals, users whose browsers don't support forms,
| visually impaired users, those who use speech synthesizers, those who
| have configured their graphical user agents not to display images, etc.
| [...]

Therefore, the `alt' attribute of an `area' element and the `alt' property
of an HTMLAreaElement object should *never* be empty.

>[...]
> area.setAttribu te("shape", "circle");
> area.setAttribu te("coords", "20,20,10") ;

>
[...]
area.shape = "circle";
area.coords = "20, 20, 10";
>
http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-26019118

| `coords' of type `DOMString'
| Comma-separated list of lengths, defining an active region geometry. See
| also `shape' for the shape of the region. See the <coords attribute
| definitionin HTML 4.01.

,-<http://www.w3.org/TR/1999/REC-html401-19991224/struct/objects.html#h-13.6.1>
|
| Coordinates are relative to the top, left corner of the object.
| All values are lengths. All values are separated by commas.

Therefore, it should be

area.coords = "20,20,10";

--

Your .sig is still broken, see
<http://en.wikipedia.or g/wiki/Signature_block #E-mail_and_Usenet >.

PointedEars
--
Anyone who slaps a 'this page is best viewed with Browser X' label on
a Web page appears to be yearning for the bad old days, before the Web,
when you had very little chance of reading a document written on another
computer, another word processor, or another network. -- Tim Berners-Lee

**Laurent vilday** · Jul 20 '08, 03:15 PM

GTalbot wrote:

>On Jul 19, 11:54 pm, "Ryan Knopp" <ryan<-delete->@theknopps.com >
>wrote:

>
OP:
>
Your From header constitutes a violation of Internet Standards and is
disregarding Netiquette. I will therefore killfile people using this
header from now on.

OMG. You are such an idiot. Do you really think the OP or anyone else is
interested about your killfile rules ?

You are the most hatefull person Usenet have ever met.

--
laurent

**Ryan Knopp** · Jul 20 '08, 06:15 PM

Re: creating image maps with dom not working in IE 7

"Thomas 'PointedEars' Lahn" <PointedEars@we b.dewrote in message
news:488318FD.4 020106@PointedE ars.de...

GTalbot wrote:

>On Jul 19, 11:54 pm, "Ryan Knopp" <ryan<-delete->@theknopps.com >
>wrote:

>
OP:
>
Your From header constitutes a violation of Internet Standards and is
disregarding Netiquette. I will therefore killfile people using this
header from now on.
>
<http://www.apps.ietf.o rg/rfc/rfc1036.html>
<http://www.apps.ietf.o rg/rfc/rfc2822.html#se c-3.4>
<http://www.apps.ietf.o rg/rfc/rfc822.html#sec-6>
<http://en.wikipedia.or g/wiki/Netiquette>
<http://www.interhack.n et/pubs/munging-harmful/>
>

>>[...]
>>It seems that I can't get the image map to work with IE7. The page is
>>located herehttp://www.theknopps.c om/test.htmland the source below.
>>>
>>I can't seem to figure out why IE7 won't recognize the image map. [...]
>>>
>> img.setAttribut e("usemap", "#m-1-1");

>>
>img.useMap = "m-1-1";
>>
>http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-35981181

>
| `useMap' of type `DOMString'
| Use client-side image map. See the <usemap attribute definitionin
| HTML 4.01.
>
,-<http://www.w3.org/TR/1999/REC-html401-19991224/struct/objects.html#ad ef-usemap>
|
| usemap = uri [CT]
^^^
| This attribute associates an image map with an element. The image map
is
| defined by a MAP element. The value of usemap must match the value of
| the name attribute of the associated MAP element.
>
The Specification is somewhat ambiguous here. What is meant is
>
usemap="#m1-1-1"
>
in (X)HTML and therefore
>
img.useMap = "#m-1-1";
>
in script code.
>

>> img.setAttribut e("alt", "");

>>
>img.alt = "";

>
,-<http://www.w3.org/TR/2003/REC-DOM-Level-2-HTML-20030109/html.html#ID-95636861>
|
| `alt' of type `DOMString'
| Alternate text for user agents not rendering the normal content of
this
| element. See the alt attribute definition in HTML 4.01.
>
,-<http://www.w3.org/TR/1999/REC-html401-19991224/struct/objects.html#h-13.6.1>
|
| The `alt' attribute specifies alternate text that is rendered when the
| image cannot be displayed (see below for information on <how to specify
| alternate text>).
>
As the image has meaning as *content* here (instead of being there purely
for layout purposes), I think it should not have an empty `alt' attribute
value.
>

> var area = document.create Element("area") ;
> area.setAttribu te("alt", "");

>>
>area.alt = "";
>>
>http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-26019118

>
| `alt' of type `DOMString'
| Alternate text for user agents not rendering the normal content of
this
| element. See the <alt attribute definitionin HTML 4.01.
>
,-<http://www.w3.org/TR/1999/REC-html40....html#adef-alt
|
| alt = text [CS]
| For user agents that cannot display images, forms, or applets, this
| attribute specifies alternate text. The language of the alternate text
| is specified by the lang attribute.
|
| Several non-textual elements (IMG, AREA, APPLET, and INPUT) let authors
| specify alternate text to serve as content when the element cannot
| be rendered normally. Specifying alternate text assists users without
| graphic display terminals, users whose browsers don't support forms,
| visually impaired users, those who use speech synthesizers, those who
| have configured their graphical user agents not to display images, etc.
| [...]
>
Therefore, the `alt' attribute of an `area' element and the `alt' property
of an HTMLAreaElement object should *never* be empty.
>

>>[...]
>> area.setAttribu te("shape", "circle");
>> area.setAttribu te("coords", "20,20,10") ;

>>
>[...]
>area.shape = "circle";
>area.coords = "20, 20, 10";
>>
>http://www.w3.org/TR/DOM-Level-2-HTM...ml#ID-26019118

>
| `coords' of type `DOMString'
| Comma-separated list of lengths, defining an active region geometry.
See
| also `shape' for the shape of the region. See the <coords attribute
| definitionin HTML 4.01.
>
,-<http://www.w3.org/TR/1999/REC-html401-19991224/struct/objects.html#h-13.6.1>
|
| Coordinates are relative to the top, left corner of the object.
| All values are lengths. All values are separated by commas.
>
Therefore, it should be
>
area.coords = "20,20,10";
>

>--

>
Your .sig is still broken, see
<http://en.wikipedia.or g/wiki/Signature_block #E-mail_and_Usenet >.
>
>
PointedEars
--
Anyone who slaps a 'this page is best viewed with Browser X' label on
a Web page appears to be yearning for the bad old days, before the Web,
when you had very little chance of reading a document written on another
computer, another word processor, or another network. -- Tim Berners-Lee

The "useMap" was the problem I was having. Like you pointed out the 'M'
in map needed capitolized. Thanks for your help.

creating image maps with dom not working in IE 7

creating image maps with dom not working in IE 7

Comment

Comment

Comment

Comment