Redirection après inactivité de la souris

**lirene42** · 12/03/2011, 11h15

Bonjour tout le monde,

Je parcours très souvent le site, et j'ai souvent trouvée réponse à mes questions

mais là je bloque.

Voici le problème :

J'ai créé une page d'accueil avec différent liens pointant sur différent site internet. Cependant je souhaiterais qu'en cas d'inactivité de la souris pendant 3 min cela me ramène à ma page d'accueil.

Dans un premier temps est-ce possible en HTML ?

Dans un deuxième temps comment pourrais-je mettre cela en place?

En vous remerciant pour cette lecture.

Lirene

**misterakm** · 12/03/2011, 11h23

En HTML pur, certainement pas.

Si tu peux utiliser du Javascript, c'est possible. Une façon simple de faire, avec jQuery : http://docs.jquery.com/Tutorials:Mouse_Position

(Il te suffit de faire un timer qui est relancé dès qu'un mouvement de souris est détecté et s'il arrive à 0, c'est qu'il n'y a pas eu de mouvement et tu peux alors faire une redirection Javascript.)

**lirene42** · 12/03/2011, 11h27

Merci pour votre réponse.

Je ne connais pas le JavaScript, je pensais qu'on pouvait le faire en HTML.
En tous cas merci pour m'avoir éclairée, si je dois m'orienter en JavaScript mon post n'est pas au bon endroit

**Auteur** · 13/03/2011, 13h01

bonjour lirene42,

voilà un exemple simple

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
 
<head>
 
<title></title>
<meta http-equiv="Content-type" content="application/xhtml+xml; charset=ISO-8859-1" />
<meta http-equiv="Content-Language" content="fr" />
 
<script type="text/javascript">
var chrono;
function startTimer()
{
        // le second paramètre de la fonction setTimeout() est en millisecondes
        // 3min = 3*60*10 ms
        // la fonction redirection() sera exécutée dans 3 min
        // on récupère l'identifiant du timer dans chrono
        chrono = setTimeout("redirection()",1800);      
                                                                                                
}       
// remise à 0 du timer avec pour identifiiant le contenu de chrono, s'il y a eu un mouvement dans la page 
// [évenement onmousemove()]
// puis redémarrage du timer en appelant la fonction startTimer()
function resetTimer()
{
        clearTimeout(chrono);
        startTimer();
}
 
// fonction appelée après 3 minutes d'inactivité de la souris (pas de mouvement dans la page)
function redirection()
{
        // redirection vers le site www.developpez.net
        document.location.href = "http://www.developpez.net";   
}
 
 
</script> 
 
 
</head>
 
<body onmousemove="resetTimer()" onload="startTimer()">
 
<div> 
bla bla bla bla bla bla
</div>
 
 
</body>
</html>

ce code réalise une redirection après 3 minutes d'inactivité de la souris. Par inactivité de la souris, cela veut pas de mouvement. Les clics sur la page ne réinitialisent pas la temporisation.

PS : il faut vraiment qu'on m'explique pourquoi les solutions à des problèmes simples passent nécessairement par l'utilisation d'une bibliothèque de 200ko alors que 20 lignes de codes suffisent

**misterakm** · 13/03/2011, 13h10

Auteur > jQuery pèse 29ko

et c'est une solution relativement simple, à condition de savoir de quoi on parle, effectivement. D'un autre côté, une telle librairie pourrait fortement l'aider à faire du code cross-browser simplement, donc au moins maintenant lirene42 en connait l'existence

!

Ta solution est parfaite puisqu'elle fournit la solution exacte (le code nécessaire et suffisant, ni trop, ni trop peu et avec les commentaires en plus)

**Auteur** · 13/03/2011, 13h29

Envoyé par misterakm

Auteur > jQuery pèse 29ko

200ko non compressée

**Sebwcip** · 28/03/2014, 10h49

Envoyé par Auteur

bonjour lirene42,

voilà un exemple simple

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
 
<head>
 
<title></title>
<meta http-equiv="Content-type" content="application/xhtml+xml; charset=ISO-8859-1" />
<meta http-equiv="Content-Language" content="fr" />
 
<script type="text/javascript">
var chrono;
function startTimer()
{
        // le second paramètre de la fonction setTimeout() est en millisecondes
        // 3min = 3*60*10 ms
        // la fonction redirection() sera exécutée dans 3 min
        // on récupère l'identifiant du timer dans chrono
        chrono = setTimeout("redirection()",1800);      
                                                                                                
}       
// remise à 0 du timer avec pour identifiiant le contenu de chrono, s'il y a eu un mouvement dans la page 
// [évenement onmousemove()]
// puis redémarrage du timer en appelant la fonction startTimer()
function resetTimer()
{
        clearTimeout(chrono);
        startTimer();
}
 
// fonction appelée après 3 minutes d'inactivité de la souris (pas de mouvement dans la page)
function redirection()
{
        // redirection vers le site <a href="http://www.developpez.net" target="_blank">www.developpez.net</a>
        document.location.href = "http://www.developpez.net";   
}
 
 
</script> 
 
 
</head>
 
<body onmousemove="resetTimer()" onload="startTimer()">
 
<div> 
bla bla bla bla bla bla
</div>
 
 
</body>
</html>

ce code réalise une redirection après 3 minutes d'inactivité de la souris. Par inactivité de la souris, cela veut pas de mouvement. Les clics sur la page ne réinitialisent pas la temporisation.

PS : il faut vraiment qu'on m'explique pourquoi les solutions à des problèmes simples passent nécessairement par l'utilisation d'une bibliothèque de 200ko alors que 20 lignes de codes suffisent

Bonjour à tous,

j'ai testé ce code et je suis redirigé au bout de quelques secondes sur le site developpez et ce même si je bouge la souris. j'ai regardé ce code il est bien détaillé, mais n'étant pas trop fort en programmation je ne vois pas ce qui cloche, surtout que certaines personnes l'ont testé apparemment sans souci.
est ce que quelqu'un pourrait me venir en aide pour voir ce qui cloche et corriger l'erreur?
je vous remercie par avance
Sébastien

**ABCIWEB** · 28/03/2014, 16h54

->cf message de asteroidz juste au dessus de ton message

Redirection après inactivité de la souris

HTML

Vue hybride

Discussions similaires

Partager

Partager