Fonction drag en JS

Résolu/Fermé

Atropa Messages postés 1940 Date d'inscription mercredi 25 juin 2008 Statut Membre Dernière intervention 11 mai 2014 - 20 juin 2009 à 10:55
Atropa Messages postés 1940 Date d'inscription mercredi 25 juin 2008 Statut Membre Dernière intervention 11 mai 2014 - 20 juin 2009 à 12:59

Bonjour,

je suis en train de faire une fonction de glisser d'élément en js, elle fonctionne partout sauf sur firefox.

la premier fois que l'on clic sur l'élément ça marche le problème c'est que la seconde fois le curseur se change en interdiction et quand on relâche l'élément reste collé au curseur.

je ne comprend pas d'où vient l'erreur...

voilà le code complet de la page :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
	<title>TEST DRAG</title>

	<script type="text/javascript">
	<!--
	

	
	function Drag(item){
		var positionX = 0, positionY = 0;
		var newPositionX = 0, newPositionY = 0;
		var id = item;
		var dimX = document.getElementById(id).offsetLeft;
		var dimY = document.getElementById(id).offsetTop;
		var test1 = true;
		var test2 = true;
		
		document.onmousemove = function (evenement) {
			if(test1 == true) {
				if(document.all) {
					positionX = event.clientX;
					positionY = event.clientY;
				}
				else {
					positionX = evenement.pageX;
					positionY = evenement.pageY;
				}
				if(test2 == true) {
					dimX = positionX-dimX;
					dimY = positionY-dimY;
					test2 = false;
				}
				newPositionX = positionX-dimX;
				newPositionY = positionY-dimY;
				document.getElementById(id).style.left = newPositionX+"px";
				document.getElementById(id).style.top = newPositionY+"px";
			}
		}
		
		document.onmouseup = function (){
			test1 = false;
		}
	}

	//-->
	</script>
	
	<style type="text/css">
	#dep {
		position:absolute;
		left:400px;
		top: 100px;
		width:75px;
		height: 35px;
		background-color:red;
	}

	</style>
</head>
<body>

	<div id="dep" onmousedown="Drag('calque');"></div>

</body>
</html>

merci de votre aide

A voir également:

Fonction drag en JS
Fonction si et - Guide
Fonction moyenne excel - Guide
Fonction somme excel - Guide
Cette fonction n'est pas disponible actuellement tv lg - Forum Téléviseurs
Snapchat ils m'ont ajouté par la fonction recherche - Forum Snapchat

2 réponses

Réponse 1 / 2

Brachior Messages postés 613 Date d'inscription dimanche 21 octobre 2007 Statut Membre Dernière intervention 22 juin 2009 46
20 juin 2009 à 12:12

bonjour ^^
il faut spécifier au navigateur que tu ne veux pas déplacer l'élément vers une autres application ...
pour cela rajoute ces "fonctions" sur les éléments en question
onmousedown='return false;'
ondragstart='return false;'

dans ton exemple ça donne :
<div id="dep" onmousedown="Drag('dep'); return false;" onDragStart='return false;'></div>

Réponse 2 / 2

Atropa Messages postés 1940 Date d'inscription mercredi 25 juin 2008 Statut Membre Dernière intervention 11 mai 2014 274
20 juin 2009 à 12:59

merci beaucoup,

j'ai mis return false a la fin de la fonction et onmousedown=" return Drag()" et c'est nikel

Discussions similaires

Javascript Arrondi à 2 chiffres après la virgule

code couleur associé a une image

Excel:récupérer le contenu d'une cellule en fonction d'une autre

Remplir une cellule (texte) en fonction d'une autre (texte).

comment contourner la fonction FILTRE

Discussions similaires

Newsletters