Re: help with firefox/Netscape rectangle-over-image please


AndrewW wrote:
> Hi
>
> I have an application that draws a selection rectangle over a map
> image. I can get it to work fine in IE and Opera, but not
> Firefox/Netscape.
>
> I've thrown the following small example together to illustrate the
> problem - the problem being that FF/NE initially draw my rectangle
> before the icon changes immediately to the black no-entry icon. Then,
> when I let go of the mouse, the rectangle continues drawing, but it
> doesn't stop as the mouseup has already fired of course.
>
> IE was doing the same, but I found the ondragstart/cancelDragDrop
> solution to that. I can't find what appears to be a similar solution
> for FF/NE.
>
> Any advice very gratefully received! Hair is fading fast :)
>
> <HTML>
> <HEAD>
> <META http-equiv=imagetoolbar content=no>
> <TITLE>
>
> </TITLE>
> <STYLE>
> #rubberBand {
> position: absolute;
> visibility: hidden;
> width: 0px; height: 0px;
> border: 2px dashed red;
> }
> </STYLE>
>
> </HEAD>
> <BODY>
> <img name="myImage" id="myImage" src="myimage.gif" height=400
> width=400>
>
>
> <DIV ID="rubberBand"></DIV>
>
> <SCRIPT>
>
> var IMG;
>
> function startRubber (evt) {
> if (document.all) {
> // IE
> var r = document.all.rubberBand;
> r.style.width = 0;
> r.style.height = 0;
> r.style.pixelLeft = event.x;
> r.style.pixelTop = event.y;
> r.style.visibility = 'visible';
> IMG.ondragstart = cancelDragDrop; // otherwise IE will try to drag
> the image
> }
> else if (document.getElementById) {
> // firefox
> var r = document.getElementById('rubberBand');
> r.style.width = 0;
> r.style.height = 0;
> r.style.left = evt.clientX + 'px';
> r.style.top = evt.clientY + 'px';
> r.style.visibility = 'visible';
> }
> IMG.onmousemove = moveRubber;
> }
> function moveRubber (evt) {
> if (document.all) { // IE
> var r = document.all.rubberBand;
> r.style.width = event.x - r.style.pixelLeft;
> r.style.height = event.y - r.style.pixelTop;
> }
> else if (document.getElementById) { // firefox
> var r = document.getElementById('rubberBand');
> r.style.width = evt.clientX - parseInt(r.style.left);
> r.style.height = evt.clientY - parseInt(r.style.top);
> }
> return false; // otherwise IE won't fire mouseup :/
> }
> function stopRubber (evt) {
> IMG.onmousemove = null;
> }
>
> function cancelDragDrop()
> {
> window.event.returnValue = false;
> }
>
> IMG = document.getElementById('myImage');
> IMG.onmousedown = startRubber;
> IMG.onmouseup = stopRubber;
>
> </SCRIPT>
> </BODY>
> </HTML>

Can anyone assist with this? It can't be impossible, but I can't work
out where it's going wrong.

Help very gratefully received, thanks in advance.

AW

.

Relevant Pages

  • Re: help with firefox/Netscape rectangle-over-image please
    ... > I have an application that draws a selection rectangle over a map ... > problem - the problem being that FF/NE initially draw my rectangle ... > var IMG; ... > function startRubber (evt) { ...
    (comp.lang.javascript)
  • help with firefox/Netscape rectangle-over-image please
    ... I have an application that draws a selection rectangle over a map ... Firefox/Netscape. ... var IMG; ...
    (comp.lang.javascript)
  • Re: Calculate the interior of a rectangle
    ... world, where lines have only length but zero thickness, subtracting the ... My above comments deal with the API Rectangle function and not the native VB ... draws the original rectangle over and over again at offsetted coordinates. ... If you wanted to visualize this using VB's Line command (with a single ...
    (microsoft.public.vb.general.discussion)
  • Re: Calculate the interior of a rectangle
    ... Your very first post in this thread said that you were drawing a RECTANGLE, but you did not state what method you were using to draw it. ... You were asked a couple of times to do that and it wasn't until your SIXTH message that you told us you were using the Rectangle GDI funtion. ... Six hours BEFORE you posted that response I posted my own message explaining how both the native VB Line method and the Rectangle GDI method drew RECTANGLES, and in my message I told you that the VB Line method draws the rectangle "up to and including" the X2,Y2 coordinates but that the Rectangle GDI method draws the rectangle "up to but excluding" the X2,Y2 coordinates. ... Even if you attempt to trip me up by taking the specific case of a horizontal LINE as being a special case of a RECTANGLE (a single pixel thick rectangle) then my description of the RECTANGLE behaviour still holds good. ...
    (microsoft.public.vb.general.discussion)
  • Re: Calculate the interior of a rectangle
    ... My latest post was in response to a statement by Steve in which he implied that what I had said earlier about the VB Line method and / or the API Rectangle method was incorrect. ... your stuff, and in some cases you need to do that for all lines, even single pixel lines. ... whereas the API draws "up to but excluding" the second set of coordinates. ...
    (microsoft.public.vb.general.discussion)