focus incorrect sur chrome lors de l'utilisation de innerHTML [Résolu]

visqueu · 24/01/2012, 15h19

bonjour

je veux faire un chronomètre en haut de la page, le chrono marche mais à chaque seconde, quand je change le contenu par javascript, le curseur me remet en haut de la page là ou il y a le chrono, et m’empêche de voir le bas de la page, et c'est uniquement sur chrome, sur firefox ça marche très bien.
j'ai deux iframes invisibles et je crois que le focus se remet à chaque appel javascript à ces iframes

voilà le code :

Code :

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
53
54
55
56
57
58
59
60
61
62
63
64
 
<iframe id="likes" name="likes" src="#" style="width:0;height:0;border:0px solid #fff;" ></iframe>
<iframe id="datarget" name="datarget" src="#" style="width:0;height:0;border:0px solid #fff;"></iframe>
<style>
.home
{
	background-color:#999;
	height:1000px;
}
</style>
 
<html>
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
	   "http://www.w3.org/TR/html4/strict.dtd">
<meta http-equiv="content-type" 
 	content="text/html; charset=ISO-8859-1"> 
<br>
  <div id=heures style="float:left;">5</div>
  <div id=minutes style="float:left;">2</div>
  <div id=secondes style="float:left;">15</div>
 
 <div class=home>
 ICI le contenu de la page
 
 </div>
 et le chrono m'emp&egrave;che de voir <u>ça</u> 
</html>
 
 
<script>
var s=15;
var m=5;
var h=12;
function timer()
{
s=s-1;
if(s==0)
{
	s=60;
	m=m-1;
}
if(m==0&&s==0)
{
	m=60;
	s=60;
	h=h-1;
}
var dah="<b>"+h+"</b>";
if(h<10)
dah="<b>0"+h+"</b>";
var dam="<b>"+m+"</b>";
if(m<10)
var dam="<b>0"+m+"</b>";
var das="<b>"+s+"</b>";
if(s<10)
var das="<b>0"+s+"</b>";
document.getElementById('heures').innerHTML="<b>"+dah+":</b>";
document.getElementById('minutes').innerHTML="<b>"+dam+":</b>";
document.getElementById('secondes').innerHTML="<b>"+das+"</b>";
window.setTimeout("timer()",1000);
}
timer();
</script>

merci d'avance

SpaceFrog · 24/01/2012, 15h46

Heu rassures moi,
c'est pas l'ordre de tes balises sur la page ...

visqueu · 24/01/2012, 15h52

j'ai juste pris les fragments de code nécessaires.
le problème vient de l'ordre ?

SpaceFrog · 24/01/2012, 16h02

tes deux iframes sont vraiment en dehors du html ???

Bovino · 24/01/2012, 16h08

Citation:

Envoyé par SpaceFrog

tes deux iframes sont vraiment en dehors du html ???

Si encore il n'y avait que ça...

Le doctype dans la balise <html>, la <script> n'importe où, pas de <head> ni de <body> (même si c'est théoriquement autorisé...) et

Citation:

j'ai juste pris les fragments de code nécessaires.

ne laisse rien augurer de bon pour le reste de la page...

visqueu · 24/01/2012, 16h08

peut importe ou je les mets, le focus se remet toujours, après chaque seconde (après chaque appel à la fonction timer() ) sur les iframes !

Code :

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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
	   "http://www.w3.org/TR/html4/strict.dtd">
<meta http-equiv="content-type" 
 	content="text/html; charset=ISO-8859-1"> 
 
<style>
.home
{
	background-color:#999;
	height:1000px;
}
</style>
 
<html>
<head>foilà</head>
<body>
<iframe id="likes" name="likes" src="#" style="width:0;height:0;border:0px solid #fff;" ></iframe>
<iframe id="datarget" name="datarget" src="#" style="width:0;height:0;border:0px solid #fff;"></iframe>
 
<br>
  <div id=heures style="float:left;">5</div>
  <div id=minutes style="float:left;">2</div>
  <div id=secondes style="float:left;">15</div>
 
 <div class=home>
 ICI le contenu de la page
 
 </div>
 et le chrono m'empeche de voir <u>ça</u> 
 </body>
 
</html>
 
 
<script>
var s=15;
var m=5;
var h=12;
function timer()
{
s=s-1;
if(s==0)
{
	s=60;
	m=m-1;
}
if(m==0&&s==0)
{
	m=60;
	s=60;
	h=h-1;
}
var dah="<b>"+h+"</b>";
if(h<10)
dah="<b>0"+h+"</b>";
var dam="<b>"+m+"</b>";
if(m<10)
var dam="<b>0"+m+"</b>";
var das="<b>"+s+"</b>";
if(s<10)
var das="<b>0"+s+"</b>";
document.getElementById('heures').innerHTML="<b>"+dah+":</b>";
document.getElementById('minutes').innerHTML="<b>"+dam+":</b>";
document.getElementById('secondes').innerHTML="<b>"+das+"</b>";
window.setTimeout("timer()",1000);
}
timer();
</script>

SpaceFrog · 24/01/2012, 16h24

il vaut mieux que le script aussi soit dans la page

Code :

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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
	   "http://www.w3.org/TR/html4/strict.dtd">
 
<html>
<head>
<meta http-equiv="content-type" 
 	content="text/html; charset=ISO-8859-1"> 
 
<style>
.home
{
	background-color:#999;
	height:1000px;
}
</style>
 
</head>
<body>
foilà
<p>
<iframe id="likes" name="likes" src="#" style="width:0;height:0;border:0px solid #fff;" ></iframe>
<iframe id="datarget" name="datarget" src="#" style="width:0;height:0;border:0px solid #fff;"></iframe>
 
<br>
  <div id=heures style="float:left;">5</div>
  <div id=minutes style="float:left;">2</div>
  <div id=secondes style="float:left;">15</div>
 
 <div class=home>
 ICI le contenu de la page
 
 </div>
 et le chrono m'empeche de voir <u>ça</u> <script>
var s=15;
var m=5;
var h=12;
function timer()
{
s=s-1;
if(s==0)
{
	s=60;
	m=m-1;
}
if(m==0&&s==0)
{
	m=60;
	s=60;
	h=h-1;
}
var dah="<b>"+h+"</b>";
if(h<10)
dah="<b>0"+h+"</b>";
var dam="<b>"+m+"</b>";
if(m<10)
var dam="<b>0"+m+"</b>";
var das="<b>"+s+"</b>";
if(s<10)
var das="<b>0"+s+"</b>";
document.getElementById('heures').innerHTML="<b>"+dah+":</b>";
document.getElementById('minutes').innerHTML="<b>"+dam+":</b>";
document.getElementById('secondes').innerHTML="<b>"+das+"</b>";
window.setTimeout("timer()",1000);
}
timer();
</script>
 </body>
 
</html>

visqueu · 24/01/2012, 17h29

bon j'ai fait quelques bricolages
j'ai mis les iframes dans une <div style="display:none">

mon code pue mais ça marche !

merci beaucoup

24/01/2012, 15h46	#2
SpaceFrog Rédacteur/Modérateur Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Inscription : mars 2002 Messages : 30 071 Détails du profil Informations personnelles : Sexe : Localisation : Royaume-Uni Informations professionnelles : Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Secteur : Industrie Informations forums : Inscription : mars 2002 Messages : 30 071 Points : 45 202 Points : 45 202	Heu rassures moi, c'est pas l'ordre de tes balises sur la page ... __________________ Ma page Developpez Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts) Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir... Votre post est résolu ? Alors n'oubliez pas le Tag réalisations :www.planet-languages.com\|www.saftair.com\| www.ouestisol.fr \| www.sebemex.fr \| www.extramiante.fr \| www.sistac-alizay.fr \| www.acoustishop.fr \| www.litt.fr \| www.ouestventil.fr
	00

24/01/2012, 16h02	#4
SpaceFrog Rédacteur/Modérateur Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Inscription : mars 2002 Messages : 30 071 Détails du profil Informations personnelles : Sexe : Localisation : Royaume-Uni Informations professionnelles : Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Analyste Programmeur Secteur : Industrie Informations forums : Inscription : mars 2002 Messages : 30 071 Points : 45 202 Points : 45 202	tes deux iframes sont vraiment en dehors du html ??? __________________ Ma page Developpez Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts) Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir... Votre post est résolu ? Alors n'oubliez pas le Tag réalisations :www.planet-languages.com\|www.saftair.com\| www.ouestisol.fr \| www.sebemex.fr \| www.extramiante.fr \| www.sistac-alizay.fr \| www.acoustishop.fr \| www.litt.fr \| www.ouestventil.fr
	00

24/01/2012, 15h52	#3
visqueu Futur Membre du Club Développeur Web Inscription : mars 2007 Messages : 64 Détails du profil Informations personnelles : Sexe : Localisation : Tunisie Informations professionnelles : Activité : Développeur Web Informations forums : Inscription : mars 2007 Messages : 64 Points : 15 Points : 15	j'ai juste pris les fragments de code nécessaires. le problème vient de l'ordre ?
	00

24/01/2012, 17h29	#8
visqueu Futur Membre du Club Développeur Web Inscription : mars 2007 Messages : 64 Détails du profil Informations personnelles : Sexe : Localisation : Tunisie Informations professionnelles : Activité : Développeur Web Informations forums : Inscription : mars 2007 Messages : 64 Points : 15 Points : 15	bon j'ai fait quelques bricolages j'ai mis les iframes dans une <div style="display:none"> mon code pue mais ça marche ! merci beaucoup
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email