11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

J'ai un problème concernant l'arrêt de l'évènement "mousemove" qui vous paraîtra probablement très simple.
Je souhaiterais qu'un évènement se déroule lorsque la sourie est enfoncé dans un div et lorsque que cette dernière bouge tout en restant enfoncé lance un nouvel évènement unique.

Voici ce qu'il en est

var slt={
    sld:function(d){
    // Je récupère la position de ma div
    var pos=getComputedStyle(d,null).left,st=pos.length-2,p=pos.substr(0,st);
    // je lance mon évènement pour la sourie enfoncée
    d.addEventListener('mousedown',function(e){
       // Je récupère la position X du curseur
        var x=e.clientX;
        // Je lance mon évènement lorsque la sourie bouge
        d.addEventListener('mousemove',function(e){
            // Je récupère la nouvelle position X
            var o=e.clientX;
            // Si la sourie bouge vers la droite
            if(parseFloat(o)>parseFloat(x)){
                // condition par rapport à la position de la div
                if(parseFloat(p)==0){
                    // Je lance une autre fonction
                    slider.goslide(d,-1200,true);
                    // là est surement mon erreur
                    e.preventDefault();
                }else{
                    e.preventDefault();
                }
            // Si la sourie bouge vers la gauche
            }else if(parseFloat(o)<parseFloat(x)){
                // condition par rapport à la position de la div
                if(parseFloat(p)<-1200){
                    // Je lance une autre fonction
                    slider.goslide(d,0,false);
                    // La même erreur
                    e.preventDefault();
                }else{
                    e.preventDefault();
                }
            }
        },false);
    },false);
};


J'ai retiré le superflu qui fonctionne, je pense que je m'y prend mal d'une part parce que je suis mauvais en javascript et d'autre part parce qu'il me manque surement du vocabulaire. Smiley bawling

Si quelqu'un avait une idée de la bonne marche à suivre ce serait l'idéal. Smiley biggrin
Modifié par t00rist (14 May 2012 - 18:41)
Oui, merci pour la réponse :
J'ai déjà essayé d.removeEvenetListener('mousemove', ect... et ça ne fonctionne pas Smiley decu
Bonjour t00rist,

tu dois considérer ces deux points :

--> le déclenchement et la récupération de la position de la souris.
--> le clic qui met fin au mouvement de ta souris.

C'est sur sur le clic sur tu effectues le remove !
Voici un petit exemple. Tant que tu ne cliques pas, tu continues de capturer la position du curseur. Dès que tu cliques, tout s'arrête.
<!doctype html>
<html>
<head>
<title>Ev&egrave;nement</title>

<script type="text/javascript">
window.onload = function ()
{
	window.addEventListener("mousemove",  window.Capture, true);
	window.addEventListener("click", window.Click,   true);
}

function Capture (event)
{
	event = event || window.event;

	document.getElementById("bloc1").innerHTML = "x = " + event.clientX + " --- y = " + event.clientY;
}

function Click (event)
{
	event = event || window.event;

	document.getElementById("bloc2").innerHTML = "x = " + event.clientX + " --- y = " + event.clientY;

	window.removeEventListener("mousemove", window.Capture, true);
}
</script>
</head>

<body>
	<div id="bloc1">bla bla bla</div>
	<div id="bloc2">bla bla bla</div>
</body>
</html>


@+
Modifié par Artemus24 (14 May 2012 - 20:14)
Effectivement, j'avais mal placé mon removeEventListener et pour couronner le tout j'avais saisi detachEvent (IE) à la place. Smiley confus
De plus je m'obstinai à 'remove' une fonction anonyme Smiley biggol ... quel boulet je fais.

Merci beaucoup pour ton aide Artemus24, mon slider fonctionne à merveille sur smartphone.
Modifié par t00rist (14 May 2012 - 21:12)