11521 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous,

J'utilise un menu, en javascript, pour certaine pages de mon site, or lorsque l'on accède à ces pages (Carnets de route) le menu de gauche reste complètement "ouvert" jusqu'à ce que la page soit complètement chargée, ce qui n'est pas très esthétique... (site: http://www.onzeroadagain.org)
Existe t-il un moyen d'éviter ça?
Je suis une poutre en javascript, et ne sait pas par où prendre le problème.
Merci d'avance pour votre aide
Alain
PS: Le script utilisé pour ces menus, provient de chez vous, comment puis-je intégrer dans mon code quelque chose du style: "designed by alsacreation" qui n'interfèrerai pas avec le fonctionnement de la page
Modifié par alainc. (01 Apr 2007 - 12:41)
salut,
il y a des chances pour que tu appelles la fonction qui ferme ton menu sur un window.onload lequel attend que la page soit complètement chargée pour travailler. Pour bien faire il faudrait que ta fonction agisse au chargement du dom (qui oeuvre dès le chargement du dom, avant images, anim and co). Je serais toi, je jetterais un oeil du côté de mootools qui implémente cette méthode pour qques misérables ko Smiley smile

have swing
Salut,
oooouh, tu vas t'attirer les foudres des maitres des lieux le DOM étant l'essentiel de leur préoccupation ici-bas Smiley smile

Le DOM c'est le document object model, en gros l'objet que nous mainpulons à tour de css et autres scripts côté client.

Très schématiquement, en javascript, chaque fois que tu atteints un élément div, tableau, ou autre, c'est un élément de cet objet que tu manipules et de son sous-objet window quand il s'agit des images ou autre contenu.

En gros once more, attendre que le dom soit chargé, c'est attendre que l'essentiel la structure de la page soit chargée et ça, sauf source de 15000 lignes, ça va relativement vite. Attendre que l'objet window soit chargé, c'est attendre que le dom et son contenu soient chargés et là, ça peut assez rapidement se gâter Smiley smile

Il y a plein de choses fascinantes à lire sur le dom sur le net, juste un début avec wikipedia et un peu plus loin avec l'incontournable w3c

bonne lecture Smiley smile

have swing
merci pour ta réponse, je vais vite me documenter...
mais j'y vois beaucoup plus clair maintenant
a écrit :
Salut,
oooouh, tu vas t'attirer les foudres des maitres des lieux le DOM étant l'essentiel de leur préoccupation ici-bas smile

Aïe, je savais que la place près de la fenêtre et du radiateur allait finir par m'attirer des ennuis Smiley rolleyes
:) à moi aussi Smiley smile c'est pourquoi, juste de retour pour préciser un petit truc avant que julien ne vienne me signaler que j'ai encore bu sur ce coup-là Smiley smile ce n'est pas tout à fait vrai de dire que window est un sous objet du dom, ce serait même l'inverse, window comprenant le dom, en clair la structure, première chose qui se charge, et le contenu et, enfin, ce que nous en faisons à travers nos manips diverses. D'où l'intérêt de commencer à manipuler les éléments du dom dès que celui-ci est dispo. Julien, j'ai bon ? Smiley smile

Have swing
Smiley biggrin t'inquiète j'suis prête à témoigner, hips, que t'a glissé sur les touches, hips, et qu 't'étais farpaitement, hips, sobre, burp...
Bon, maintenant sérieusement il faut que je trouve comment faire la modif, et quoi tripatouiller pour y arriver..
:) salut,
ben écoute perso, maintenant, j'utilise mootools qui justement implémente les évènements ondomready. Tu peux n'en télécharger que les parties qui t'intéressent et n'avoir qu'une feuille de js extrèmement légère à joindre à ta page (ceci dit, si tu mets les doigts dedans, méfie-toi, ça donne envie de jouer Smiley smile ).
jette un oeil à leur site, moins spectaculaire que scriptaculous mais on fait quasi autant que prototype et scriptaculous pour moins de la moitié du poids. Quand à la partie dom et window si ça tiens en 2/3ko compressé, c'est bien le diable...

Have swing
ça risque pas de mettre un peu plus la zone si j'ajoute une feuille de script? Je ne peux pas ajouter ce script dans les balises head de la page?
Question très bête: je trouve où le guide d'utilisation de ce site, j'dois plus avoir l'électricité à tous les étages, parce que j'y pane rien....
alainc. a écrit :
Smiley biggrin Bon, maintenant sérieusement il faut que je trouve comment faire la modif, et quoi tripatouiller pour y arriver..

Bonjour,
La méthode
window.onload=montre
marche sur tous les navigateurs, mais n'éxécute la fonction montre() qu'une fois la page entièrement chargée. Pour charger cette fonction juste après le DOM, je te conseille d'utiliser la librairie javascript proposée par Tanny O'Haley's qui a l'avantage de fonctionner sur beaucoups de browsers et de pouvoir lancer plusieurs fonctions simplement :
addEvent(window, 'DOMContentLoaded', montre)
par éxemple. Smiley cligne
Sinon sans aller aussi loin tu as une methode trés, trés simple pour éviter d'attendre tout le chargement de ta page pour que ton script s'active c'est au lieu de mettre un window.onload, ecrire directement l'appel de ta fonction dans ton code html APRES les balises concernée (c'est a dire aprés ton menu).

<ul id="menu">
   <li><a href="#">item 1</a></li>
   <li><a href="#">item 2</a></li>
</ul>
<script type="text/javascript">initMenu('menu')</script>

C'est tout simple et c'est fiable.

Si t'as pas besoin d'autre fonction exotique, je te conseil pas d'installer mootool si c'est juste pour faire ouvrir et fermer un menu, même si effectivement c'est amusant de swinger avec, ceci dit leur démo rame a fond sur firefox...
Modifié par matmat (02 Apr 2007 - 04:36)
Modérateur
Salut,

Juste un petit mot pour dire que personnellement, j'ai arrêté d'utiliser ces méthodes de chargement rapide, n'en connaissant pas une qui soit vraiment efficace, parce que je préfère que le menu fonctionne partout plutôt que sous les quelques navigateurs pris en charge.

Je pense qu'il vaut mieux faire avec et s'arranger pour rendre cette apparition moins désagréable... enfin, ce n'est qu'un avis, hein ! Smiley cligne
Salut à toi Koala,

Merci pour ta réponse, plaine sagesse je dois dire...
Dde toutes façons j'ai suffisamment de quoi me prendre la tête avec mon site et IE, pour laisser de côté ce menu... Smiley langue
Bonsoir,

Pour ma part, je partage l'avis de koala64, mais je fais quand même une exception pour l'utilisation de l'événement non standard DOMContentLoaded, qui est fiable et ne demande pas de détection de navigateur.
alainc. a écrit :
Bonjour,

Heu Chmel, j'ai utilisé ta méthode, mais ça à pas l'air de marcher...

Tu as peut-être oublié l'accès au fichier events.js
<script type="text/javascript" src="js/events.js"></script>

En tout cas, ce script marche même sur IE5/win, Netscape7... Il y a peut-être que sur IE5mac qu'il ne marche pas.
J'avais cru, moi aussi, lire sur ce forum qu'il était préférable de loger les scripts dans le head. Mais c'est évidemment plus simple et souvent plus fiable d'utiliser la méthode préconisée par Matmat. Je crois que je vais revenir à ma vieille méthode, juste avant la balise </body>
Modifié par chmel (03 Apr 2007 - 00:33)
Si c'est préferable de charger les scripts dans le head, mais cette méthode est vraiment trop lourde, et comme je preférere quand les scripts sont actif tout de suite j'en suis arrivé à cette conclusion.