Redirection après inactivité de la souris

Version imprimable

28/03/2014, 11h23
Sebwcip

Redirection après inactivité de la souris

Bonjour à tous,

je débute en javascript et je suis à la recherche d'un code qui me fasse une redirection vers une autre page web en cas d'inactivité de la souris pendant 10 secondes par exemple
j'ai trouvé quelques fonction pour cela, mais je ne sais comment les assembler pour arriver au résultat escompté

setTimeout avec un temps en millisecondes
clearTimeout pour annuler le temps du chrono si un mouvement souris est détecté
document.location.href pour rediriger vers une autre page
onmousemove pour détecter le mouvement souris

je pense qu'il faut déclencher un timer dès le démarrage de la page avec onload??
reset du timer avec onmousemove
déclenchement de la redirection après 10 secondes avec setTimeout

quelqu'un peut-il m'aider à coder cette demande?
je vous en remercie beaucoup
Sébastien

Bonjour,

A froid j'écrirai quelque chose qui ressemble à ça :

Code:

1
2
3
4
5
6
7
8
9
10
11
window.onload = init; //Lorsque la page à finis de charger
 
    function init()
    {
        var timeOut = setTimeout(function (){window.location = 'http://www.google.fr'}, 5000); //redirection au bout de 5 secondes
        document.onmousemove = function()
        {
            window.clearTimeout(timeOut);
            init();
        }
    }

Dîtes moi si cela fonctionne.

Bonjour,

Merci pour votre aide.
j'ai testé votre code dans mon html mais cela ne semble pas fonctionner
voici comment je l'ai introduit:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<html>
<head>
 
<script type="text/javascript">
window.onload = init; //Lorsque la page à finis de charger
 
    function init()
    {
        var timeOut = setTimeout(function (){window.location = 'http://www.google.fr'}, 5000); //redirection au bout de 5 secondes
        document.onmousemove = function()
        {
            window.clearTimeout(timeOut);
            init();
        }
</script>
</head>
<body>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque eros justo, lacinia eu semper sit amet, placerat id enim. Aenean sit amet mattis nisl. Duis ornare egestas magna, vitae lacinia mauris ornare vitae. In volutpat, augue a adipiscing tincidunt, nulla tellus laoreet diam, at tristique arcu nunc ac enim. Nullam viverra libero ac sollicitudin sodales. Aenean id arcu vel augue dictum tincidunt. Etiam sed purus tortor. Duis at venenatis quam. Nulla iaculis massa quis ipsum rutrum, vitae aliquam turpis pharetra. Morbi a mi sit amet sapien gravida venenatis at faucibus dolor. Curabitur luctus velit congue, egestas eros eu, tempor velit. Phasellus a turpis ac felis varius faucibus et vitae tortor. Duis feugiat sapien in metus tristique, vitae sagittis dolor porttitor. Integer eget rutrum odio. Maecenas vulputate massa eget eros faucibus, placerat semper velit posuere. Sed lectus risus, commodo eget tellus et, faucibus volutpat velit.
 
Morbi volutpat lectus quis cursus tincidunt. Curabitur accumsan nunc lectus, sed eleifend orci cursus quis. Donec eget aliquam mauris. Curabitur ut turpis ac velit congue auctor ac et dui. Donec bibendum hendrerit malesuada. Vestibulum scelerisque eget ipsum sed sollicitudin. Suspendisse ultrices urna mi, eu tincidunt mauris sollicitudin quis. Praesent non odio sed nunc ultrices scelerisque. Duis a erat augue. Morbi et sapien feugiat, sollicitudin est non, malesuada ante.
</body>
</html>

Merci de votre aide
Sébastien

il manque un e} à ton code

Code:

1
2
3
4
5
6
7
8
9
10
    function init()
    {
        var timeOut = setTimeout(function (){window.location = 'http://www.google.fr'}, 5000); //redirection au bout de 5 secondes
        document.onmousemove = function()
        {
            window.clearTimeout(timeOut);
            console.log('....');
            init();
        }
    }

A+JYT

31/03/2014, 10h11
Sebwcip

Bonjour Sekaijin,

En effet, cela fonctionne parfaitement. Un grand merci à tous les deux pour votre aide et le temps que vous m'avez consacré
Bonne journée
Sébastien

Sekaijin, BooMan,

je reprend le script que vous m'avez fourni.
j'ai deux questions concernant celui-ci:
1° est-il possible d'avoir une variable qui serait transposée entre mes pages html?
je m'explique: le code renvoi à une page en cas d'inactivité de souris. Est il possible de ne pas recopier à chaque fois ce code dans chaque page HTML mais d'utiliser un code dans ma page index.html qui serait appliqué tout de même aux autres pages HTML?

2°le code que vous m'avez fourni, fonctionne bien, mais la réactivité du surf en est ralentie du fait du test du bouger de souris. est-il possible dans ce script d'ajouter quelques choses qui dirait de ne tester le mouvement de souris que toutes les secondes et non toutes les x milli secondes (si vous connaissez la fréquence à laquelle votre script est réinterprété je veux bien la connaître)
Code:

1 2 3 4 5 6 7 8 9 10 11 window.onload = init; //Lorsque la page à finis de charger function init() { var timeOut = setTimeout(function (){window.location = 'http://www.google.fr'}, 5000); //redirection au bout de 5 secondes document.onmousemove = function() { window.clearTimeout(timeOut); init(); } }
je vous remercie tous les deux de votre aide et ceux qui voudront bien se joindre à cette discussion.
j'ai besoin de réponse à ces questions, mon employeur me presse avec cela
Sébastien

29/07/2014, 17h04
Sebwcip

Bonjour,

j'ai testé un timeout de 60000 et non plus 5000. je pensais pourvoir rediriger ma page après 60 secondes et non plus 5 mais cela ne fonctionne pas, ma page ne redirige pas... je passe plus d'une minute à attendre... je ne sais pas au bout de combien de temps la page sera redirigé ni même si elle le sera.
est ce que quelqu'un peut me venir en aide?

Je vous en remercie
Sébastien

Pourquoi rappeler init() dans le onmousemove ? C'est pour ça que ça rame, c'est presque une boucle infinie vu la fréquence de déclenchement du onmousemove... Voilà une solution plus légère :
Code:

1 2 3 4 5 6 7 8 var inactivityTime = 0; //en secondes document.onmousemove = function(){ inactivityTime = 0; } setInterval(function(){ inactivityTime++; if(inactivityTime > 60){ window.location = 'http://www.google.fr'; } }, 1000);
Et pour répondre à ta première question, il suffit de mettre ce script dans un fichier .js et de l'importer avec la balise <script> sur toutes tes pages.

31/07/2014, 14h44
Sebwcip

Bonjour SylvainPV,

Merci beaucoup de m'avoir répondu et d'avoir proposé une alternative au code. Je vais de ce pas le tester.

Sébastien

Sylvain,

j'ai testé ton code sur ma page mais la redirection ne se fait pas
Voici ce que j'ai mis sur ma page Web
Ai je oublié quelque chose?
Code:

1 2 3 4 5 6 7 8 9 10 11 <script type="text/javascript"> window.onload = init; //Lorsque la page à finis de charger var inactivityTime = 0; //en secondes document.onmousemove = function(){ inactivityTime = 0; } setInterval(function(){ inactivityTime++; if(inactivityTime > 60){ window.location = 'http://www.google.fr'; } }, 1000); </script>
Merci de ton aide

31/07/2014, 15h16
Bovino

Citation:

Ai je oublié quelque chose?

Probablement de regarder ta console d'erreur (F12) qui doit te dire que la fonction init n'existe pas... :whistle:
31/07/2014, 16h58
SylvainPV

Oui pas besoin du window.onload, c'est complètement négligeable vu le temps d'inactivité avant redirection.