Page 1 sur 2
Prise en compte des calques avec Firefox [résolu]
Publié : 13 nov. 2004, 09:36
par Mirovinben
Bonjour à tous
Ce post est mon premier post sur ce forum. Je viens d'installer Firefox sur mon PC (XP Home-SP2) et souhaite l'utiliser à la place de IE6...
J'ai créé un site perso utilisant des calques grâce à une librairie javascript qui teste le navigateur avec "document.all" (=IE >5.0) ou "document.layers" (NS 4.7)... ne riez pas mais c'était l'environnement que je connaissais au moment de mes premiers développements...
Comme vous vous en doutez, Firefox refuse d'afficher mes calques.. Quelle alternative me propsez-vous... Je peux sans regrets remplacer mes test sur NS4 par des tests sur Firefox (équivalent NS??).
exemple de script à modifier :
function ActivLayer(Nom) {
if (Nom!=null){
if (document.all) {document.all['IE'+Nom].style.visibility="visible";}
if (document.layers) {document.layers['NS'+Nom].visibility="show";}
}
}
mon site (normalement des calques s'affichent sur la page de gauche) selon le lien survolé en page de droite...
ici
Merci d'avance...
Publié : 13 nov. 2004, 11:55
par calimo
Il faut utiliser documentGetElementById. Il se comporte comme le document.all mais il est "standard" c'est à dire défini par un organisme indépendant.
Il marche sur tous les navigateurs actuels, en tous cas tous ceux supportant le JS, IE 5 et +, Netscape 6 et+, Mozilla, Firefox, Safari, Konqueror, Opera etc
Ainsi la fonction suivante devrait marcher :
Code : Tout sélectionner
function ActivLayer(Nom) {
if (Nom!=null){documentGetElementById['IE'+Nom].style.visibility="visible";
}
Après les calques, des bulles d'aide
Publié : 13 nov. 2004, 12:25
par Mirovinben
calimo a écrit :Il faut utiliser documentGetElementById. Il se comporte comme le document.all mais il est "standard" c'est à dire défini par un organisme indépendant.
Il marche sur tous les navigateurs actuels, en tous cas tous ceux supportant le JS, IE 5 et +, Netscape 6 et+, Mozilla, Firefox, Safari, Konqueror, Opera etc
Ainsi la fonction suivante devrait marcher :
Code : Tout sélectionner
function ActivLayer(Nom) {
if (Nom!=null){documentGetElementById['IE'+Nom].style.visibility="visible";
}
Merci pour ta réponse qui confirme mes recherches et tests de ce matin... J'ai modifié ma librairie qui est donc à présent compatible également avec Firefox...
Par contre je rencontre un pb d'adaptation d'une autre librairie créant des bulles d'aide avec ".innerHTML" qui ne semble pas avoir d'équivalent hors Krosoft et qui me permettait facilement d'insérer du code Html dans un groupe <div>...</div>
Pour la partie NS4.x j'utilisais document.layers["bulle"].document.write(HTML)...
Publié : 13 nov. 2004, 12:32
par bobo
calimo a écrit :Code : Tout sélectionner
function ActivLayer(Nom) {
if (Nom!=null){documentGetElementById['IE'+Nom].style.visibility="visible";
}
Attetion de bien mettre des () et non des []
Publié : 13 nov. 2004, 12:40
par Mirovinben
bobo a écrit :calimo a écrit :Code : Tout sélectionner
function ActivLayer(Nom) {
if (Nom!=null){documentGetElementById['IE'+Nom].style.visibility="visible";
}
Attetion de bien mettre des () et non des []
Voui, j'avais corrigé (et même inséré un "." entre document et Getxxx !)
Publié : 13 nov. 2004, 14:37
par martin
Bonjour,
innerHTML fonctionne dans firefox et mozilla.
Je te file un lien en béton pour ce genre de correspondance, et solutions à apporter en cas de problème:
http://www.quirksmode.org/
Publié : 13 nov. 2004, 14:56
par Bobe
c'est document.getElementById()
Code : Tout sélectionner
function ActivLayer(Nom) {
if (Nom!=null){document.getElementById('IE'+Nom).style.visibility="visible";
}
Concernant quirksmode.org, oui, c'est un très bon site et je le recommande assez souvent. Attention cependant, l'auteur n'est pas toujours très objectif dans les résultats qu'il donne.
innerHTML n'est pas standard.
Publié : 13 nov. 2004, 15:00
par calimo
La référence du support de DOM par Mozilla :
http://www.mozilla.org/docs/dom/domref/
Et en particulier
innerHTML
Cela dit je n'ai jamais réussi à coder quoi que ce soit en JS, donc voilà, j'essayais
Publié : 13 nov. 2004, 15:10
par PsyDk
Cette référence est vraiment excellente, je m'en sers quand je dois faire du javascript
Pour ajouter ou modifier du contenu dynamiquement, je manipule directement l'arbre du document à l'aide de fonctions comme createElement, createTextNode, appendChild... Une logique très cohérente
Publié : 13 nov. 2004, 15:43
par Mirovinben
martin a écrit :(...)innerHTML fonctionne dans firefox et mozilla.(...)
Pour innerHTML, il semblerait que cela ne fonctionne que pour lire du code (dump) et non pour en écrire... et il faut que j'arrive à écrire du html dans mon DIV !
PsyDk a écrit :(...)Pour ajouter ou modifier du contenu dynamiquement, je manipule directement l'arbre du document à l'aide de fonctions comme createElement, createTextNode, appendChild... Une logique très cohérente
Oups... Je vais approfondir...
Ton idée est intéressante sauf que je speak pas trop à l'aise l'english ! Tu n'aurais pas un didactitiel in french sous la main ou un exemple d'utilisation ? voui, j'abuse... excuse-moi ! mais j'aimerait tant avoir des scripts "multi-navigateurs" et je parie sur le succès de plus en plus grand de Firefox !
Publié : 13 nov. 2004, 15:45
par Bobe
Les traduction françaises des spécifications officielles pour le DOM (Document Object Model):
http://www.yoyodesign.org/doc/w3c/w3c.html#dom2
Pas franchement user-friendly mais néanmoins indispensable.
Après, pour des ressources en français, euh...
Publié : 13 nov. 2004, 15:49
par Mirovinben
Bobe a écrit :Les traduction françaises des spécifications officielles pour le DOM (Document Object Model):
http://www.yoyodesign.org/doc/w3c/w3c.html#dom2
Pas franchement user-friendly mais néanmoins indispensable.
Après, pour des ressources en français, euh...
Merci !...
Je vais également potasser ma doc
"SELFHTML" qui m' a bien dépannée jusqu'à maintenant...
Au fait !... J'ai oublié de préciser que ce que je veux écrire dans mon <DIV>...</DIV> est de l'Html (en fait un tableau à fond coloré pour faire une bulle d'aide plus sophistiquée). Je dis celà car en potassant le principe des "noeux" j'ai réussi à afficher quelque chose mais c'est du texte pur : le code html s'affiche comme si on voyait le source !... (createTextNode)
Publié : 13 nov. 2004, 18:23
par martin
Désolé, personnellement je n'ai pas trouvé de la doc conséquente sur ce sujet qu'en anglais (à part la recommendation traduite par Yoyodesign bien sûr). Enfin presque, en voilà un quand même:
http://gilles.chagnon.free.fr/cours/dhtml/
pour écrire des données (simples) dans un tag html, voilà un exemple minimaliste:
Code : Tout sélectionner
document.getElementById("idDiv").childNodes.item(0).data="ceci est un essai";
Plus rigolo, un exemple pour générer un tableau :
http://www.mozilla.org/docs/dom/technote/tn-dom-table/
plein de ressources diverses, et d'autres exemples :
http://www.mozilla.org/docs/dom/samples/
Sinon, regarde les docs javascript et ecmaScript, qui en fait te donneront les outils pour manipuler le DOM. Les docs de Netscape (sur javascript en autre) ne sont malheureusement plus accessibles directement aujourd'hui, il semblerait que la fondation mozilla essaie de récupérer ce qu'elle peut.
Cependant en fouillant on les trouve :
http://www.mozillazine.org/talkback.html?article=5381
Ne pas oublier le
génialissime Inspecteur Dom de Mozilla ou Firefox, qui permet de parcourir ce foutu DOM dans tous les sens, et de faire des modifications en direct dans celui ci.
(Sinon innerHtml fonctionne en écriture, si çà te semble plus simple. Mon exemple devient :
Code : Tout sélectionner
document.getElementById("idDiv").innerHTML="ceci est un essai";
Mais il ne te permettra de faire des choses aussi subtiles.)
Publié : 14 nov. 2004, 02:46
par Bobe
Mirovinben a écrit :
Je vais également potasser ma doc
"SELFHTML" qui m' a bien dépannée jusqu'à maintenant...
Attention quand même, le site a pas l'air très à jour.
Publié : 14 nov. 2004, 05:56
par Mirovinben
Merci à tous...
Vos conseils m'ouvrent de nouveaux horizons... " Que le DOM soit avec moi".
Je croyais avoir testé en long en large et en travers innerHtml... J'ignore quelle erreur je faisais... Quoiqu'il en soit le bout de code proposé par "martin" fonctionne très bien... oups ! Voir
ici le résultat... (ADSL souhaité ! ce sont des vignettes qui s'affichent dans la bulle d'aide)
Pour ce qui est du site "SELFHTML", il date un peu mais est très pratique... si vous avez aussi commode et plus à jour... je prends !