Fonction toggle marche po

**Lideln** · 24/06/2007, 14h39

Bonjour !

Justement j'avais le même problème : afficher certaines infos si JavaScript n'est pas activé, et afficher le site "normal" si JavaScript est activé.
J'ai suivi les conseils dans un post de ce site, et je remarque que dans ce topic E.Bzz conseille la même chose.

Le seul problème c'est que chez moi ça ne marche pas... Pourquoi ?

Voici 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
 
<script type="text/javascript">
	function forceJavaScript()
	{
		var div = document.getElementById('div_noscript');
		alert(div);
		alert(div.style.display);
		var div2 = document.getElementById('div_javascript');
		alert(div2);
		alert(div2.style.display);
		div.style.diplay = "none";
		div2.style.diplay = "block";
		alert(div.style.display);
		alert(div2.style.display);
	}
</script>
<body onload='forceJavaScript()'>
	<div id="div_javascript" style="display:none;">
		// du code PHP qui génère ma page "normale" du site
	</div>
	<div id="div_noscript" style="display:block;">
		require_once('include/banner.php'); // juste un div avec une image de fond
		require_once('pages/error_no_javascript.php'); // une page php qui fait juste "echo 'blabla';"
	</div>
</body>

Voici ce que me renvoient les 'alert' :

Code :

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

1
2
3
4
5
6
7
 
object HTMLDivElement
block
object HTMLDivElement
none
block // ici je devrais avoir 'none'
none // ici je devrais avoir 'block'

Il y a deux problèmes :
1) le style des div n'est PAS changé, et du coup ma page n'est pas visible, je ne vois que le ptit script php qui affiche 'blabla'
2) encore pire : je suis censé voir le block 'div_noscript' (puisque ca bug), mais le plus grave c'est que je ne vois même pas le header ! (le div avec une image en background)

Si quelqu'un voit où j'ai fait une erreur svp... ?

(je précise que ce sont mes premiers pas, ou presque, en javascript)

Merci beaucoup d'avance !

EDIT : j'ai créé un nouveau topic car le précédent étant résolu par son auteur, je risquais pas de toucher bcp de monde
EDIT2 : j'ai tenté de déplacer le code du javascript a plein d'endroits de la page, sans succes

**Lideln** · 24/06/2007, 14h51

Nouveauté !

Je continue de faire des tests...
Si je mets le style dans un css plutot que directement dans le div, les alert() affichant le style n'affichent plus rien... C'est normal ça ??

Pfff jcomprends plus rien

Pliiiiiz help !

**Lideln** · 24/06/2007, 15h12

Bon pour le problème d'affichage/masquage c'est réglé. Je viens de remarquer que dans la code que j'avais chopé sur le net, il était marqué "diplay" et non "display".

Par contre reste 2 problèmes :
1) Pourquoi ça n'affiche rien dans mes alert() si je mets le style dans mon fichier CSS et non dans le div directement ?
2) Pourquoi l'include de la banner ne semble pas marcher ? (jvais fouiller, dans 95% des cas c'est le gars qui pose la question qui a oublié un truc :p )

Merci

**Lideln** · 24/06/2007, 16h48

Encore une chtite question pour la forme :

Quand je détecte que JavaScript n'est pas activé, j'affiche une (grosse) page qui explique comment l'activer avec tous les navigateurs.
Le souci c'est que si JavaScript est activé, on a le temps d'apercevoir rapidement cette page (donc dans le div:display=block) avant que la fonction du onload soit appelée et donc cache ce div et montre le div de la page "normale".

Y a-t-il un moyen de bypasser ça ?

**Auteur** · 24/06/2007, 23h38

Envoyé par Lideln

Par contre reste 2 problèmes :
1) Pourquoi ça n'affiche rien dans mes alert() si je mets le style dans mon fichier CSS et non dans le div directement ?

Code javascript :

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

1
2
document.getElementById("idElement").style.attribut =

Cette syntaxe permet de lire les valeurs contenues dans l'attribut style et non la CSS (lecture du "style en ligne"). Donc pour plus de simplicité laisse ton code tel qu'il est.

2) Pourquoi l'include de la banner ne semble pas marcher ? (jvais fouiller, dans 95% des cas c'est le gars qui pose la question qui a oublié un truc :p )

Je ne connais pas le PHP, je ne peux pas te répondre

Y a-t-il un moyen de bypasser ça ?

Non, pas en javascript en tout cas... le script ne peut pas s'executer tant que la page n'est pas chargée. Mais tu peux faire une redirection

Exemple :

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
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title> Page d'accueil</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="fr" />
<meta http-equiv="Refresh" content="5; URL=http://pageNoScript.htm" />
 
 
<script type="text/javascript">
<!--
function redirection()
{
 document.location.href="pageScript.htm";
}
 
//-->
</script>
 
</head>
 
<body onload="redirection()">
 
<h3 style="color: #5555FF">Veuillez patientez.....</h3>
 
</body>
 
</html>

Si ton navigateur a son javascript activé alors la fonction redirection est activée.
Si le javascript n'est pas activé, la balise meta :

Code html :

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

1
2
 
<meta http-equiv="Refresh" content="5; URL=http://pageNoScript.htm" />

réorientera l'utilisateur vers pageNoScript.htm au bout de 5 secondes

**Lideln** · 25/06/2007, 02h52

Han !!!

C'est tellement évident maintenant que tu le dis ! Pour être honnête j'avais pensé au truc de redirection au bout de x secondes, mais je pensais que c'était du javascript (et oui je suis gros débutant

)

Je vais tester ça dès demain soir (car là dodo, car demain matin boulot

)

Merci beaucoup !

(et merci pour le msg privé aussi)

Lideln

**Auteur** · 25/06/2007, 10h27

encore mieux :

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
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title> Page d'accueil</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="fr" />
<meta http-equiv="Refresh" content="2; URL=http://pageNoScript.htm" />
 
 
<script type="text/javascript">
<!--
function redirection()
{
 document.location.href="pageScript.htm";
}
 
//-->
</script>
 
</head>
 
<body onload="redirection()">
 
<h3 style="color: #5555FF">Veuillez patientez.....</h3>
 
<div>
Vous allez être redirigé vers une autre page dans quelques secondes.... 
<a href="pageNoScript.htm" title="redirection">
Si rien ne se produit cliquez sur ce lien
</a>
</div>
 
</body>
 
</html>

Comme ça si la redirection ne s'opère pas, l'utilisateur aura toujours un lien de secours

Et accessoirement, dans la balise meta j'ai réduis le temps d'attente à 2 secondes (si le navigateur a javascript, la redirection est instantannée).

**FremyCompany** · 26/06/2007, 11h00

Généralement on fait plutot ceci :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
<HEAD>
   ...
   <!-- A insérer dans toutes les pages du sites sauf http://pageNoScript.htm -->
   <NOSCRIPT>
       <meta http-equiv="Refresh" content="2; URL="http://pageNoScript.htm" />
   </NOSCRIPT>
   ...
</HEAD>
<BODY>
   <!-- Contenu de la page -->
</BODY>

On redirige si il n'a pas javascript activé
Si javascript est activé, il n'y a pas de partie de page "Activer le JavaScript" qui s'affiche
Si javascript est activé, la partie page "Activer le JavaScript" n'est pas téléchargé à chaque fois, donc gain de vitesse et de bande passante !

Fonction toggle marche po

JavaScript

Discussions similaires

Partager

Partager