javascript rubberband zoom box

[Doug Williams]

Forgive me, I simplified something and did not look at it in Interent Explorer.

To fix this for IE you will have to change the first div.

This was the code that does not work in IE:
    <div 
style="position:relative;border:0px;height:300px;width:600;border-style:none;background-image:url(<?php
echo $image_url?>);"><img src="<?php echo $image_url?>">

This is what does work:
        <div style="position:relative;border:0px;"><button
style="height:300px;width:600;border-style:none;background-image:url(<?php
echo $image_url?>);border;0px;"  type="button"></button>


So the div pair should be:
        <div style="position:relative;border:0px;"><button
style="height:300px;width:600;border-style:none;background-image:url(<?php
echo $image_url?>);border;0px;"  type="button"></button>
        <div id=drawdiv name=drawdiv onmousemove="getMouseXY(event);"
onmousedown="setMouseXY(event,'x1','y1');"
onmouseup="setMouseXY(event,'x2','y2');document.mapserv.submit();" 
style="position:absolute;top:0px;left:0;height:300px;width:600;border:0px;"></div>
   </div>


Additionally, I added the following javascript to handle the case where the
user drags the mouse off the map with the mouse button pushed.  It can just
sit somewhere in a script section.

<script>

function resetZoomBox () {

   mouseIsDown = false;
   document.getElementById('drawdiv').innerHTML = '';

}

if (IE) {
  if (window.Event) document.captureEvents(Event.MOUSEUP);
  document.onmouseup = resetZoomBox;
} else {
  window.captureEvents(Event.MOUSEUP);
  window.onmouseup = resetZoomBox;
}

</script>


I'll try to get it righter the first time next time.