11548 sujets

JavaScript, DOM et API Web HTML5

Problème compatibilité JS et Firefox...

Pages :
Bonjour!!

Je viens vers vous car j'ai un problème duquel je n'arrive pas à me dépêtrer !!! Smiley bawling

Je vous explique j'ai un petit script javascript à la con pour qu'au démarrage ma page aille direct à une ancre.

C'est donc 
window.location = '/#ancre'


Et ça passe bien sous chrome et opera, mais pas sous ff !!! et je ne sais pas pourquoi Smiley sweatdrop
Le but et le script état vraiment tout simple jene comprend pas pourquoi ça marche pas...
Alors j'ai quand même fouillé un peu sur le net et j'ai donc essayé

window.location
window.location.href
window.location.hash
document.location
etc...


mais rien...
Je sais plus trop comment résoudre ce problème...

help Smiley confused
Pour utiliser les ancres, essaie plutôt d'utiliser :


  window.location.hash = "ancre"

  /* ce qui ajoutera "#ancre" au bout de ton url */


Tu peux aussi regarder du côté de "onhashchange" pour détecter le changement de ce paramètre dans l'URL. Si je ne me trompe pas, jQuery te permettra de l'utiliser sur les anciens navigateurs aussi.
Salut!

J'ai déjà testé avec 
window.location.hash

mais même symptôme qu'avec les autre... le "onhashchange" je l'ai vu sur 2 ou 3 site, mais je suis pas sur que ça m'aide. En fait j'ai "juste" besoin que ma page d'index "soit" une ancre, et je pensais pas que c'était aussi pénible (pour rester poli) surtout qu'il n'y a QUE firefox qui me bloque...
paolo a écrit :
window.location="#ton_id";


Si le type de guillemet n'ont pas d'importance, j'ai déjà essayé...


Patidou a écrit :
J'ai fait un truc dans le genre pour des tabs, c'est pas optimisé mais il y a la gestion des ancres au chargement de la page. Tu devrais pouvoir adapter. Smiley smile


Ahhh je vais jeter un coup d'oeil à ça, merci beaucoup !!
Modifié par adnvirus (19 Oct 2011 - 13:56)
paolo a écrit :
Tu dois avoir un autre pb sur ta page. Ta console ne renvoie pas d'erreur ?


Justement non... après on peut régler la tolérance de la console?
Bon alors voila le debut de mon code :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<link rel="stylesheet" href="/css/styles.css" type="text/css" media="screen" />

<title>Minuit Quarante</title>

<script language="JavaScript">
document.location.hash = 'home';
</script>



</head>

<body>


niveau script il n'y a que ça, après c'est le code du site qui demarre. Tout est donc en une page, avec des ancres par ci par la.

Donc voila la video

http://www.youtube.com/watch?v=JsuoT5Ij63o

Voilà si vous voulez plus d'explication, pas de soucis !
paolo a écrit :
Un peu plus de code serait utile. Là c'est...succinct


Oui je veux bien, mais j'y connais rien Smiley ohwell
Tu veux faire quoi exactement? Un site sur une page mais dont les différentes parties seraient accessibles via des ancres, c'est ça?
Patidou a écrit :
Tu veux faire quoi exactement? Un site sur une page mais dont les différentes parties seraient accessibles via des ancres, c'est ça?


Oui c'est ça, mais ça j'y arrive! Mon seul problème c'est la page root.
En fait ce qu'il faudrait c'est que lorsqu'on clic ou qu'on tape "www.monsite.com" ça devienne automatiquement "www.monsite.com/#ancre" et que le contenu soit affiché, c'est juste ça qui marche sous opéra et chrome, mais plante sous firefox...
Si les autres parties doivent être masquées tu devrais pouvoir adapter le code du lien que je t'ai donné plus haut:

— la liste des tabs devient un bandeau de navigation
— le section devient un div
— les articles des sections
Patidou a écrit :
Si les autres parties doivent être masquées tu devrais pouvoir adapter le code du lien que je t'ai donné plus haut:

— la liste des tabs devient un bandeau de navigation
— le section devient un div
— les articles des sections


J'ai regardé ce que tu m'as donné mais j'ai pas tout compris.
En fait derrière la création de ce portfolio y a un but, pas de js, ou du moins le moins possible, j'en aurait besoin pour google et apparemment pour ça.
Mais le but c'est que ce soit tout géré par le css3.
J'ai essayé de faire une redirection en php, mais vu que je m'y connais autant en js qu'en php, ça marchait même pas du tout en php...

Donc voulais j'ai juste besoin d'un tout petit bout de code (que je pensais avoir) pour que la page d'accueil renvoi sur une ancre, et ça marchait bien jusqu’à ce que je test sous firefox...
Modifié par adnvirus (22 Oct 2011 - 13:32)
Je n'ai pas été assez clair : est-ce que ça sera une longue page avec les sections bout à bout ou les sections hors ancre seront masquées?

P.S. : l'utilisation de JavaScript n'impacte en rien le référencement par google si le contenu html est complet, sémantique et navigable js désactivé. Smiley smile
Modifié par Patidou (22 Oct 2011 - 15:01)
Patidou a écrit :
Je n'ai pas été assez clair : est-ce que ça sera une longue page avec les sections bout à bout ou les sections hors ancre seront masquées?

P.S. : l'utilisation de JavaScript n'impacte en rien le référencement par google si le contenu html est complet, sémantique et navigable js désactivé. Smiley smile


Ce qui est hors ancre est masqué Smiley cligne mais si je veux faire ça c'est plus un challenge perso que pour plaire à google ou autre Smiley biggrin

Et j'ai trouvé quelque chose qui marche à peu près, je sais pas trop comment j'en suis arrivé là mais j'ai gardé ce code pour chrome et opera 
<script language="JavaScript">
document.location.hash = 'home';
</script>
qui ne marche donc pas correctement dans firefox, et j'ai créé un fichier .htaccess avec 
Options +FollowSymlinks
RewriteEngine on

RewriteRule /index.php /index.php#home
pour firefox (mais qui ne marche pas seul dans chrome et opera)

Donc avec les deux ça marche dans les 3 navigateurs, il y a des variantes dans les adresses mais ça marche, et je sais pas vraiment pourquoi... Smiley biggol Smiley sweatdrop
Ben alors mon exemple précédent était bon (avec une légère adaptation au niveau css et code html), en plus ça fonctionne sans redirection.

Explication : le <article> à afficher dispose d'une class selected qui le rend visible alors que les autres sont envoyés en dehors de la page (si javascript est activé). Pareil pour la barre de navigation, le <li> a une class selected pour l'afficher avec un fond blanc au lieu de gris. Dans le code html il suffit de mettre la class "selected" sur l'élément voulu par défaut.
Pages :
Sujet clos
Aller à