Problems with draggable element in Firefox

[Deserted]

Hi All,

I've been working on a simple draggable static gallery at http://timsdevarea.com/gallery/gallery-test.html - basically its a static background image in a large div, which can be dragged around and will resize itself according to maintain a "seamless" look.

unfortunately I've run into a problem with it, in IE7/8, and Opera it works flawlessly, however in Firefox 3.5, it drags fine the first time, but on subsequent attempts firefox attempts to drag the background image out of the browser, rather then dragging the content.

I'm assuming that I'm failing to reset something after mouse release, but I can't see what it is. I'm open to solutions, either through modifying whats there, or moving to a JS framework if the same objective can be easily achieved.

thanks in advance

Des

[SparoHawk]

Its Firefox's fault which comes from its "drag" behavior. By default Firefox fires a drag behavior after your first mousedown.

What you need to do is call the preventDefault() in your mousedown function:

function mousedown(env) {

    if(env.preventDefault)
    {
        env.preventDefault();
    }
    
    var elem = document.getElementById("innerbox");
    var pos = getElementPosition(elem);

    mouse = true;

    old_x = mousePos(env).x;
    old_y = mousePos(env).y;
    cur_x = pos.x;
    cur_y = pos.y;
    elem = null;
}

That fix worked nice.