Changer le titre de la page en fonction des ancres

Version imprimable

28/07/2011, 14h00
camyo

Changer le titre de la page en fonction des ancres

Bonjour,

Je suis face a un soucis que j'ai du mal a résoudre.

En gros, mon site n'a qu'une page ( physique )... mais des contenus différents selon les rubriques ..

du coup, mes url ressemble à ça :
/index.html#page_1/
.. à ..
/index.html#page_10/

en javascript,
la récupération de l'ancre c'est ça:

Code:

document.location.hash

La modification du titre

Code:

document.title = "mon titre";

Mais je voudrais surveillé en permanence ( et pas que sur le onClick )
l'url .. et selon l'ancre, changer le titre ..

je rame un peu ...
Merci a ceux qui auront 5 minutes de leur temps a m’offrir pour me sortir de là
28/07/2011, 15h32
Invité
J'imagine que tu sais déjà changer le titre.
Je suppose donc que tu as une fonction updateTitle(); qui choppe l'ancre et change le titre.

Tu n'as quà faire un Interval qui va appeler régulièrement updateTitle.

Code:

var timer=setInterval(updateTitle, 1000);//check l'ancre toutes les secondes

edit : je viens de voir que Interval était pas cross compatible. Donc avec setTimeout :
Code:

1 2 3 4 5 var launcher=function(){ updateTitle(); window.setTimeout(launcher,1000); }; launcher();

Merci, y'a de l'idée ..
Et ça fonctionne :

J'ai effectivement une fonction updateTitle()

Code:

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
function updateTitle(){
	var ancre = document.location.hash;
	switch (ancre) {
	 case '#page_1/':
	 document.title = "mon titre - Accueil";
	 break;
	  case '#page_2/':
	 document.title = "mon titre 2";
	 break;
	  case '#page_3/':
	 document.title = "mon titre 3";
	 break;
	  case '#page_4/':
	 document.title = "mon titre 4";
	 break;
	   case '#page_5/':
	 document.title = "mon titre 5";
	 break;
	   case '#page_6/':
	 document.title = "mon titre 6";
	 break;
	   case '#page_7/':
	 document.title = "mon titre 7";
	 break;
	   case '#page_8/':
	 document.title = "mon titre 8";
	 break;
	   case '#page_9/':
	 document.title = "mon titre 9";
	 break;
	   case '#page_10/':
	 document.title = "mon titre 10";
	 break;
	 default: 
	 document.title = "mon titre ";
 
	 break;
	}
}

Mais j'aurais voulu une fonction qui surveille l'url
un truc genre "onchange" ...

Mais bon, là, ça fonctionne .. Alors Merci :)

28/07/2011, 16h27
Bovino

Citation:

je viens de voir que Interval était pas cross compatible.

8O
Euh... si, au moins depuis IE5 :aie:

Ceci dit, quel est l'intérêt par rapport à une gestion des onclick qui sera plus réactive et moins gourmande en ressources :koi:

EDIT : sinon, tu peux utiliser l'événement onhashchange, mais là, il risque effectivement d'y avoir des problèmes de compatibilité (IE8 +, FF 3.6+, Opera 10.6 +, Safari 5+).
28/07/2011, 16h32
camyo

j'peux pas utiliser un onclick car il n'y a pas forcement de click pour passer d'un contenu à un autre ...

mon site est sur une page unique ... tout en longueur ..
et la molette de la sourie peux permettre de passer d'un contenu à un autre ..

le click aussi ... il "slide" d'une pseudo page à une autre ..

( dans quelle galere je me suis mis :aie: )
28/07/2011, 16h34
Bovino

Oui, mais si tu scrolles, il n'y a pas de raison que l'URL change (ou alors, j'ai raté une étape :aie:) donc le timer ne détectera pas le changement d'ancre :koi:
28/07/2011, 16h37
Invité

Citation:

Euh... si, au moins depuis IE5

Effectivement, je m'étais mis en tête que les nav de niveau 4 c'était des navigateurs un peu ancien (genre de 4eme génération).

J'aurais du me douter que c'était IE(4) qui était pas compatible.
28/07/2011, 16h40
camyo

Et pourtant si ...
c'est une fonction javacript .. mais elle est déjà aussi en setInterval ..

ça va finir par être très gourmand..
28/07/2011, 16h46
Bovino

Ben dans ce cas, pourquoi tu changes pas le title en même temps que l'URL ? :koi:

PS : tu as vu mon EDIT ?

Citation:

EDIT : sinon, tu peux utiliser l'événement onhashchange, mais là, il risque effectivement d'y avoir des problèmes de compatibilité (IE8 +, FF 3.6+, Opera 10.6 +, Safari 5+).
28/07/2011, 16h50
camyo

parce que des fois ... on passe a coté des évidences ...:oops:

MERCI A VOUS :ccool:

Sujet clos avant de me ridiculiser

( Bovino, oui, j'avais vu onhashchange ... mais le risque que la moitié des visiteurs ne puissent le voir .. )
28/07/2011, 17h03
Bovino

Citation:

Envoyé par camyo

parce que des fois ... on passe a coté des évidences ...:oops:

Ben ça sert à ça aussi le forum :)
Quand on a la tête dans le code depuis un moment, c'est pas rare de tomber dans ce genre d'étourderie !

Citation:

mais le risque que la moitié des visiteurs ne puissent le voir ..

Si je regarde rapidement les stats de W3Schools, on arrive quasiment à 90% de visiteurs concernés :mrgreen: