BrowserIncompatibilityLog < Main

Main Web>WebProgrammingKnowHow? >BrowserIncompatibilityLog (23 Dec 2006, MattWalsh)EditAttach

IE event handler functions

Say you set up an event handler like this...
element.onmouseover = handle_mouse_over();
The following works in Firefox, but not IE...

function handle_mouse_over(e) {
   if (e.target) {
      targ = e.target
   } else if (e.srcElement) {
      targ = e.srcElement
   }
}

Intead, you are not to declare the event in the function. It is implicitly declared and always named event. Thanks again to the incomparable PPK!

function handle_mouse_over(e) {
   var targ;  // target element
   if (!e) var e = window.event;
   if (e.target)           { targ = e.target;     }
   else if (e.srcElement)  { targ = e.srcElement; }
   if (targ.nodeType == 3) {targ = targ.parentN;  } // defeat Safari bug
}

removeChild and IE

/*
 *  First I must take the element out of the array
 *  *Then* I can remove the child from the DOM
 */
function delete_item_image(i)
{  //g_lock_delete_button = true;
   if (confirm("Are you sure you want to delete this image?")) {
      edit_delete_button.style.visibility="hidden";
      el = item_image_elements[i];
      item_image_elements[i] = null;
      BODY.removeChild(el);
   }
   //g_lock_delete_button = false;
}

checking visibility doesn't seem to work...

This works once with IE, then always is true even though the item is hidden. Maybe IE sets opacity to 0 for invisible objects.

      if (el.style.visibility == "") {
         return;
      }

These statements MUST be in this order. It must be that setting opacity to zero sets visibility off (?)

      el.style.visibility="";  // IE bug - these lines MUST be in this order
      setOpacity(el, 0);

IE doesn't auto encode URLs

      var url = "/sku-bin/script?text=does this work";// + entered;
      url = encodeURI(url);
      request.open("GET", url, true);
      request.onreadystatechange = updatePage;
      request.send(null);

This script doesn't work without encodeURI on IE, but does work with Firefox. It's of course the right thing to do in any case. Here's the differences between all the decoding methods

DOCTYPE makes IE behave?

Thanks to Ali Babba and w3schools

This HTML looks wrong unless I have one of the following DOCTYPE declarations on top

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

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

<div style="margin: 0px 20px 0px 170px;">
<table style="width: 100%; background: green; color: WHITE;">
<tr>
<td>
Content Content Content Content Content Content Content Content
Content Content Content Content Content Content Content Content Content
Content Content Content Content Content Content Content Content Content
Content Content Content Content Content Content Content Content Content
Content Content Content Content Content Content Content Content Content
Content Content Content Content Content Content Content Content Content
Content Content Content Content Content Content Content Content Content
Content Content Content Content
</td>
</tr>
</table>
</div>

Weird IE tables

Need to disect this

#left {
width: 246px;
float: left;
}

#main {
margin-left: 246px !important;
margin-left: 0;
}   

The first left margin is for firefox.  The second is for IE.

Positioning

read this

-- MattWalsh - 03 Sep 2006

Topic revision: r9 - 23 Dec 2006 - 21:42:41 - MattWalsh

Main

Webs
Main
Sandbox
TWiki

Copyright © by the contributing authors. All material on this collaboration platform is the property of the contributing authors.
Ideas, requests, problems regarding TWiki? Send feedback