[js] drag and drop

Dla specjalistów Webmastering
#1

Napisałem prosty skrypcik przesuwający diva po naciśnięciu i przytrzymaniu przycisku (taki suwak):

x = 1;

var pX;

var inter = null;

document.onmousemove = move;

document.onmouseup = drop;


function drop()

{

x = 1;

}


function move(e)

{

	pX = e.pageX;

}


function drag(obj)

{

leftX = parseInt(obj.style.left.replace(/px/, ""));

startX = pX;

x = 0;

inter = setInterval(przesun,100);


function przesun()

{

if (x==1) {clearTimeout(inter);}

obj.style.left = (leftX+pX-startX+20)+"px";

}

}

I pojawił się problem. Suwak chodzi dobrze aż do pewnego momentu gdy zaczyna się zachowywać jak obrazek (mogę go przenosić po stronie z tym że nie mogę wrzucić na pasek zakładek) po puszczeniu przycisku wraca na swoje miejsce lecz przesuwa się za myszką (chociaż nie powinien bo puściłem przycisk myszy) a czasem w ogóle nie chce się zatrzymać mimo że x=1.

Przeglądarka to Firefox. A problem pojawia się po za małym odstępie w czasie pomiędzy przesuwaniami.

#2

Na samym końcu do function drag(obj) dopisz

obj.ondragstart = function() { return false; };

czyli

[...]

 function przesun()

	    {

		    if (x==1) {clearTimeout(inter);}

		    obj.style.left = (leftX+pX-startX+20)+"px";

	    }

	    obj.ondragstart = function() { return false; };

    }

Swoja drogą masz trochę pogmatwany ten kod.