Rechercher : dans
Par :

Drag n drop

Dernière réponse le 4 mar 2009 à 01:38:16 Smoking bird, le 27 fév 2009 à 17:32:28 
 Signaler ce message aux modérateurs

Bonjour,

Je débute dans javascript, et j'essai de créer un effet de drag n drop, mais pour le moment j'essui un échec critique. J'ai notamment un sacré problème sur la portée des variables, et je ne sais comment le régler. Bien que je les déclare hors de toute fonction, le fait de les modifier dans une fonction ne me permet pas d'y accéder à travers une autre fonction

Voici le code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style>
#dean {
	border:1px solid red; background-color:blue; width:75px; height:75px; position:absolute;
}
</style>
<script language='javascript'>
	var mouseX; var mouseY;
	var innerMX; var innerMY;
	var xObj; var yObj;
	var wObj; var hObj;
	var e; var Obj; var dragin;
	
function move(Obj){
	e = window.event;
			mouseX = e.x;
			mouseY = e.y;
			xObj = Obj.offsetLeft; yObj = Obj.offsetTop;
			wObj = Obj.offsetWidth; hObj = Obj.offsetHeight;
			dragin = true; Obj = document.getElementById(Obj);
		//Obj.style.left=mouseX; Obj.style.top=mouseY;
}
function clear(){
	if( dragin == true ){
		dragin = false; Obj = '';
	}
}
function moving(){
	if( dragin == true ){
		//Obj.style.left = mouseX; Obj.style.top = mouseY;
		alert(Obj+' '+mouseX+' '+mouseY);	
	}
}
</script>
</head>
<body onmouseup='clear()' onmousemove='moving()'>
	<input type='text' id='infos' onmousedown='move("infos")'/>
		<div>
			<div id='dean' onmousedown='move("dean")'></div>
		</div>
</body>
</html>


Quelqu'un pourrait-il m'aider?

En vous remerciant,

Smoke
Configuration: Windows Vista
Opera 9.63

Meilleures réponses pour « Drag n drop » dans :
Télécharger TaskBar Shuffle VoirTout simple mais pratique: Ce programme permet de déplacer les tâches dans la barre des tâches par simple drag-n-drop (glisser-déposer). Optionnellement, il peut également grouper automatiquement les fenêtres (par exemple, pour garder ensembles les...
SQL - Modification de table VoirModification de table Il est possible de supprimer une table grâce à la clause DROP, il existe aussi des commandes moins extrêmes permettant L'ajout de colonnes La modification de colonnes La suppression de colonnes Enfin, il est possible...

1

jmg78, le 27 fév 2009 à 18:22:46

En règle général mettez le lien c' est plus facile pour debuguer , cela facilite le travail de ceux qui peuvent répondre.
si vous ne voulez pas mettre le code integral recopiez le partiellement voir profil (enregistré)

Répondre à jmg78

2

Smoking bird, le 27 fév 2009 à 18:31:05
Répondre à Smoking bird

3

jmg78, le 27 fév 2009 à 18:46:55

Faut faire ton getElementById plus tot
un conseil ne reutilises pas le meme nom voir profil (enregistré)

Répondre à jmg78

4

Smoking bird, le 27 fév 2009 à 18:53:58

Comment ça ne pas réutiliser le même nom?

Répondre à Smoking bird

5

Smoking bird, le 1 mar 2009 à 05:15:53

Up

Répondre à Smoking bird

6

 Smoking bird, le 4 mar 2009 à 01:38:16

Après avoir proprement tout repris depuis le début, j'ai réglé mon problème (ça arrive souvent comme ça).

Je serais complètement incapable de dire comment, vu le nombre d'autres problèmes que j'ai rencontrés par la suite, mais mon script a atteint un stade d'avancement satisfaisant. Actuellement il est on ne peut plus fiable, tant qu'on reste sur IE ou Opera. Il bug sous FF, Safari et Chrome, pour une raison qui m'échappe, compte tenu de mes précédents tests qui démontraient qu'il était relativement cross-browser (sauf pour Firefox -_-').

Je mets donc le fil en résolu, et n'ajouterais pas d'autres commentaires.

Répondre à Smoking bird
Collection CommentÇaMarche.net