ElMoustiko

Un peu d'accord sur le fait que le menu peut etre un peu pénible pour un minorité non negligeable et à ne pas négliger, perso, je prefere l'utilisation du onclick pour ce genre de menu qui fait moins "sautiller" les menu et limite à mon sens la casse, de plus pour des menu vraiment très volumineux, il me semble que justement, le fait de "n'afficher que les gros titres" permet une meilleure vue d'ensemble de la navigation et je conseil ce type de menu justement pour de gros menus, un autre exemple, pour des détails dans un menu, par exemple j'ai prévu perso, de faireun menu pour mes tutoriels, et des sous menus présentant les extensions à ces tutoriels, non indispensable pour une vue globale du site. Par ailleur, avec justement l'externalisation de la source JS, il est très facile d'implémenté une petite checkbox "utiliser le menu déroulant" controlant la fonction du menu. Donc en effet il faut bien réfléchir avant, à l'utilisation que l'on fait du JS. Un autre exemple, la galerie photo, le JS permet de ne pas à avoir à recharger la page et rend la navigation plus facile. Donc : 1- si on utilise le JS, vérifier que sa desactivation n'entrave pas la navigation. 2- que l'effet recherché apporte un réel plus à la navigation et à l'ergonomie. 3- faire un code propre et si possible extrait du corps de la page. Voici selon moi 3 points essentiels pour bien utiliser le JS. _AT_Laurent, j'espere que je t'ai convaincu de mon utilisation du menu déroulant

Pour la fonction qui manquait permettant de retirer le #, un truc de ce style devrait etre faisable : var bloc = document.getElementById(this.href).substring(1, X); En prenant X le numéro du caractère de fin, par exemple pour #bloc1, en faisant substring(1, 6) on obtient bloc1 [edit] J'ai peut etre plus propre pour trouver la valeur "6" de notre exemple... var bloc = document.getElementById(this.href); bloc = bloc.substring(1, bloc.length); Un truc de ce gout là.

Allez je me lance à l'arrache sans test, je vous donne un truc à vue de nez alors ! xhtml : <ul id="nav_zone"> <li><a href="#bloc1">ouvrir/fermer bloc 1</a></li> <li><a href="#bloc2">ouvrir/fermer bloc 2</a></li> <li><a href="#bloc2">ouvrir/fermer bloc3</a></li> </ul> <div id="bloc_zone"> <div id="bloc1">bloc1</div> <div id="bloc2">bloc2</div> <div id="bloc3">bloc3</div> </div> css : /** pas grand chose à faire, c'est selon le style que tu veux faire **/ div#bloc1, div#bloc2, div#bloc3 { /* NE PAS METTRE LE display: none; ICI*/ } Et le JS : function showHide() { hideDivs(); var links = document.getElementById('nav_zone').getElementsByTagName('a'); for (var i = 0; i < links.length; i++) { links[i].onclick = function() { var bloc = document.getElementById(this.href); /*** il va manquer un truc ici, il faut gerer la chaine de caractere this.href pour supprimer le 1er caractere (#), je sais plus trop ce que c la syntaxe, mais ca doit pas etre bien compliqué) ***/ if(bloc.style.display != "none") { bloc.style.display = "none"; return false; } else { bloc.style.display = ""; return false; } } } } function hideDivs() { var blocs = document.getElementById('bloc_zone').getElementsByTagName('div'); for( var j = 0; j < blocs.length; j++ ) { blocs[j].style.display = "none"; } } window.onload = showHide; Donc c'est de l'arrache sans tests là tel quel c'est sûr que ca peut pas marcher, mais tu as en gros l'idée... enfin je pense ! Il y a peut etre plus simple [edit] J'oubliais un truc, le principe de fonctionnement Donc si JS il y a, on ouvre le bloc correspondant au href, c'est à dire #bloc, s'il est deja ouvert, on le ferme, on peut imaginer rapeller hideDivs pour fermer toutes les divs, c'est au choix. Et si JS n'est pas actif, tout est ouvert (c'est pour ca qu'il ne fallait pas gerer le display: none ; dans les css) et le click sur le lien envoie au div correspondant.

Pour pierre et petit-ourson : http://www.evolt.org/article/Javascript_na...0273/index.html Ceci devrait pouvoir vous aider dans vos questions/problèmes. @++

C'est mon petit "combat" du moment, ne pas proscrire le JavaScript sous prétexte qu'il est mal utilisé par certains. Le javascript permet des choses que PHP ou CSS ou xHTML ne permettent pas, personnelement je trouve que le JavaScript est vraiment utile en ce qui concerne un gain en qualité de navigation et en ergonomie (j'utilise des grands mots, mais je pense ne pas me tromper...), par exemple un menu déroulant, pour un menu très volumineux, permet un gain de place et une clarification d'un menu. Le fait d'utiliser le JavaScript (lorsque c'est bien fait) ne doit pas empecher la navigation si celui ci est désactivé, donc sans JS, on se retrouve dans l'exemple d'un menu déroulant, avec le menu totalement déroulé, et donc parfaitement utilisable, mais juste un peu plus encombrant, uniquement pour les utilisateurs ayant désactivés le JS. Donc le JavaScript, toujours à l'ordre du jour, mais il faut faire attention à ce qu'il n'empeche pas la navigation en cas de desactivation et que l'effet recherché ne soit pas réalisable via CSS ou PHP par exemple, c'est comme pour tout, il faut le faire bien Pour ce qui est du temps d'apprentissage, tout dépend de la vitesse à laquelle tu apprend , mais je dirais que tu peux arriver à des choses sympa assez rapidement avec un minimum d'aide pour démarrer, donc si tu as une question sur un problème précis, tu peux toujours demander !

Le mieux est l'extraction TOTALE de toute source JS du corps de la page html, en appelant le(s) script(s) JS dans la partie <head>, via <script type="text/javascript" src="script.js"></script> Il faut ensuite s'assurer que la désactivation du JavaScript n'entraine pas une perte d'acces au document ou à quelque information, le JavaScript doit permettre un poil d'ergonomie en plus mais sans compromettre l'acces à la page et au contenu. La séparation contenu/script permet une gestion de ce genre de chose plus facile (je trouve), un gain en propreté de code, en poids des pages et en gestion des éléments dynamiques. Insérer un script dans la page comme tu le dis petit-ourson reviens au même que de l'extraire totalement du corps de la page, mais tu n'a pas le gain en clarté du document, et il te faudrait répéter ce code pour chaque page qui l'utilise, alors qu'un appel de fonction est plus clair et plus facile à mettre en place et rend ton document plus propre.

Très facile Enfin à premiere vue, mais je ne doute pas que ca soit réalisable Par contre tu devras peut etre utiliser des class/id pour associer le lien d'ouverture au bloc à ouvrir... Je laisse la place aux experts, j'y jeterais peut etre un oeil si j'ai le temps cette semaine.

Si tu veux un forum en rapport avec Dreamweaver, je te conseil celui ci : http://dreamweaver.media-box.net

Si tu ne connais pas ou peu le html, peut être devrais tu commencer par là, parceque le PHP sans support n'a pas de réel interet à mon avis

Il faudrait préciser quelle version de html tu utilises dans un premier temp, html4.0 transitionnal, strict, xhtml1, strict, .... ??? Ensuite, pour les animations flash, il faut, je crois, utiliser la balise object et non embed... Je ne suis pas super expert donc je ne suis pas sûr à 100% Un truc de ce style donc : <object type="application/x-shockwave-flash" width="longueur" height="largeur" data="chemin"><param name="nom de la valeur" value="valeur" /></object> @++

Bon, je n'ai pas eu l'occasion de toucher au script, mais j'ai parcouru les sites que tu m'as indiqué, et je crois que ça devrait le faire, ce sont vraiment de bonnes sources je trouve ! Pourquoi on ne les trouves ps sur google ? Je ne dois pas chercher les bonnes choses En tout cas merci bien de me les avoir indiqué, je pense que je vais pouvoir réussir à faire quelque chose de tout ceci, mais quand, telle est la question ! Tu auras peut etre des nouvelles milieu de semaine Et j'espere que tu pourras me dire ce qui va et ce qui ne va pas @++

L'attribut name rempalcé par l'attribut id, oui mais pas tout le temps, notament pour les formalaires, il faut converver name pour les utiliser via php au moins... enfin je crois que ca marche pas sinon...

J'en sais rien, c'est pas moi qui ai codé la chose, j'imagine que ca doit servir si c'est indiqué mais ca n'est pas indispensable ni obligatoire, et perso je ne vois pas à quoi il peut servir, j'attend l'avis de personnes éclairées.

Tout à fait, je vais te donner l'exemple mis sur le site de Karl Dubost : a[hreflang^="fr"] { background: url(fr.gif) right center no-repeat; padding-right: 12px;} a[hreflang^="fr-qc"] { background: url(fr-qc.gif) right center no-repeat; padding-right: 12px;} a[hreflang^="fr-ch"] { background: url(fr-ch.gif) right center no-repeat; padding-right: 12px;} a[hreflang^="en-us"] { background: url(en-us.gif) right center no-repeat; padding-right: 12px;} } a[hreflang]:after { content: url(/2002/09/03-fr-qc.gif); } Donc la premiere version permettra d'ajouter un petit drapeau à droite du lien, en image de fond, donc fonctionnera sur tous les navigateurs (a priori, enfin tous les modernes au moins, >v4), la seconde solution, que je trouve plus élégante, fera la même chose, mais en ajoutant l'image apres le lien, (:after). Tu peux aussi ajouter du texte, content: "[EN]" ; Mais avec :after (et :before) ca ne fonctionnera pas sous IE. Donc pour ton exemple, avec du texte, ca ne fonctionnera pas sous IE a moins de faire une image de fond représentant l'écriture [EN], je trouve ca un peu bordelique pour si peu. Donc a mon avis contente toi de faire pour les non IE et tant pis pour les autres. Donc un code de ce style irait : a[hreflang="en"]:after, a[hreflang="en-us"]:after { content: "["attr(hreflang)"]"; } Et zou ! le tour est joué, ca ajoute [en] ou [en-us] apres tes liens. Tu peux faire aussi : a[hreflang="en"]:after, a[hreflang="en-us"]:after { content: "[EN]"; } Ce qui rajoutera [EN] apres les liens en et en-us. Sinon autre solution, tu n'indique les hreflang QUE des liens en, en-us, ... et tu fais ceci via css : a[hreflang]:after { content: "["attr(hreflang)"]"; } ou bien sûr comme tout à l'heure a[hreflang]:after { content: "[EN]"; } Je suis en train de me dire aussi que tu dois pouvoir gérer la casse (majuscule ou minuscule) du content via text-transform: uppercase; ou lowercase. A tester ! Voilà ! @++

OUpssshhh, le name dans les input, pas dans les id... donc je récapitule au propre : dans le form, tu met method="..", action=".." dans les label tu met for="..." dans les input tu met name="..." pour la gestion du formulaire (via php ou autre), et id="..." pour le label, avec for = label et enfin name dans le input type="submit" qui te sers à vérifier que le formulaire à été soumis ou non. @++ ps : merci bien pour le compliment.

Le name, c'est au input type="submit" qu'il faut le mettre, pour pouvoir gérer la soumission. Le label est quand à lui relié à l'id, via l'attribut for. Le name dans les id, c'est là aussi un attribut de controle du formulaire via php par exemple. @++

Euh non il y a moi aussi ! Bravo pour ton PR6, même si je n'y attache pas une importance (même pas du tout à vrai dire), je pense que c'est une petite récompense tout de même et pas forcément évidente à obtenir. @++

?????????????? Et ca voulait dire quelque chose ton truc là ?

Et Hooop tu peux te baser la dessus : http://www.alsacreations.com/articles/modeles/g_d_fixe.htm Je n'ai pas regardé le code CSS, mais le code HTML n'a rien de stupide, il peut, par ailleurs, peut etre etre améliorer... je dis bien peut etre ! @++

Jan, ex pyromane

Si tu veux j'ai fait un petit tuto rapide de style switcher PHP. Il ne doit pas être totalement complet et bourrés de fautes, mais tu as déjà le principe. http://www.elmoustikoblog.net/tutoriels/php/style_switcher/ Il va peut etre deconné, je l'ai repris sur un de mes sites mais le modifiant en "direct live" sans tester, mais a prori ca le fait. Sinon la solution JS est tout à fait envisageable, mais la gestion des cookies avec JS est vraiment chiatique je trouve. @++

Si tu veux utiliser <em></em> c'est dans le <h1>, c'est une balise inline alors que <h1> est de block. Si ce n'est QUE pour de la mise en forme, <em> n'est pas adapté, <em> sert à marquer une différence avec le reste du texte, genre pour "souligner" un terme. (je met souligner entre guillemets). Tu peux utiliser un <span> pour n'appliquer l'italique qu'a une partie de ton <h1> <h1><span class="autre_style">ton texte</span> et la suite du titre</h1> Avec comme code css : h1 span.autre_style { font-style: italic; } @++

Le php renvoi du HTML, et donc le doctype correspond au html renvoyé.

Il me semble que l'utilisation d'un format d'encodage adapté fait que tu n'as pas besoin de "coder" les caractères accentués et spéciaux.

Je vais consulter les liens que tu m'as donné, mais j'ai repensé un peu moins bettement mon idée premiere, en effet, childNodes est un array, je pensais donc faire un truc du style : h2s[i].parentNode.onmouseover = function() { hideAll(); var cur_ul = this.getElementsByTagName('ul')[0]; cur_ul.style.display = ""; } h2s[i].parentNode.onmouseout = function() { var childs = this.childNodes; for(var k = 0; k < childs.length; k++) { if((this.target.nodeName != childs[k].nodeName) || (this.event.toElement != childs[k].nodeName)) { hideAll(); } } } Donc on recupere les elements enfant dans childs (array) et on test le nodeName du target par rapport au nodeName de childs[k], ca parait faisable (dans ma tete), je n'ai pas testé (en semaine, j'ai pas trop le temps... je ne pourrais m'attaquer à tes liens que ce week end). Mais tu disais que target n'etait pas un attribut de this.. pourquoi ? (this correspond à h2s.parentNode) Sinon les evenements mouseover et mouseout sont fait sur le parentNode du h2 j'ai <div> <h2>titre</h2> <ul> <li>...</li> ... <li>...</li> </ul> </div> donc le parentNode de h2 est div, et je veux tester que le mouseOut ne conduit pas sur div.childNodes c'est à dire, h2 ou ul. Enfin je crois que tu avais compris. Peut confirmer ou infirmer que ce que j'ai fait avec la boucle for est bon ? Et m'expliquer ce que tu voulais dire : "target (qui n'est pas un attribut du this dans ta fonction" Et aussi (si tu a le temps ) target c'est pour IE ou les autres ? (et vice versa avec event.toElement). Sinon je regarderais ce week end. Voila, merci de t'interesser à mon probleme quand meme !!! j'espere réussir à faire un truc pas mal au final ! @++