[DHTML Drag & Drop] pour ceux qui posent toujours des questions

Marsh Posté le 22-03-2001 à 23:29:29

quelqu'un avait posé une question sur le drag & drop mais je ne sais plus ou est le sujet alors voici une reponse

voila l'illustration de Drag & Drop avec un div, une zone de texte et meme un bouton. En fait, on peut faire glisser tout quasiement tout les objets. En meme temps, je montre comment recuperer les coordonnées de la souris par rapport à l'ecran, par rapport a la page html et enfin par rapport à l'objet sur lequel se trouve le curseur de la souris.

pour ie4 ou ie5 ou sup

<html>
<head>
<title>Drag & Drop</title>
</head>
<body>
<script language="javascript">
var dx=0;
var dy=0;
var objet=null;
var mv=0;

function md() {
if (event.srcElement.tagName!="BODY" ) {
objet=event.srcElement;
}
dx=event.offsetX;
dy=event.offsetY;
mv=0;
}

function mm() {
if (objet!=null) {
objet.style.left=event.clientX-dx;
objet.style.top=event.clientY-dy;
}
document.all.z.value="Ecran : "+event.screenX+","+event.screenY+"\nFenêtre : "+event.clientX+","+event.clientY+"\nObjet : "+event.offsetX+","+event.offsetY+" => "+event.srcElement.tagName+" ["+event.srcElement.name+"]";
mv=1;
}

function mu() {
objet=null;
}

function cb() {
if (mv==0) {
alert("evenement \"onClic\" sur le bouton \""+event.srcElement.name+"\"." );
}
}

document.onmousedown=md;
document.onmousemove=mm;
document.onmouseup=mu;
</script>
<textarea name="z" rows="3" cols="40" style="position:absolute;left:102px;top:0px">Vous pouvez déplacer tous les éléments présents sur cette page.</textarea>
<input name="bouton de toto" type="button" value="Le Drag & Drop c'est génial" style="position:absolute;left:102px;top:55px" onClick="cb()">
<div name="coucou" style="position:absolute;left:0px;top:0px;width:100px;height:200px;background-color:C0C0C0"></div>
</body>
</html>

Reply

Marsh Posté le 22-03-2001 à 23:29:29

Reply

Marsh Posté le 31-05-2005 à 17:56:21

ok merci bien et pour mozilla firefox ?

Reply

Marsh Posté le 31-05-2005 à 18:05:44

p@radox a écrit :

ok merci bien et pour ~~mozilla firefox~~ ?

tous les navigateurs autres que MSIE [:aloy]
(Mozilla Firefox, Opera, Safari, Konquerror, iCab, ...)

Accessoirement, la balise [fixed] c'est pas fait pour les chiens [:itm]

---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody

Reply

[DHTML Drag & Drop] pour ceux qui posent toujours des questions

Sujets relatifs:

Leave a Replay