| |
|
Voir le sujet précédent :: Voir le sujet suivant
|
| Auteur |
Message |
| |
|
curieuxmann
WRInaute discret
Inscrit le: 23 Nov 2003
Messages: 94
|
 Posté le : Jeu Déc 11, 2003 19:13 Sujet du message: Menu déroulant en (X)HTML pur avec liens, est-ce possible ? |
|
|
Bonsoir,
J'aurais voulu savoir s'il était possible de faire des menus déroulants simples avec liens en (X)HTML pur ? (C'est à dire sans Javascript, etc. ?)
Par menus simples avec liens, j'entends ce type de menu déroulant :
Un menu que l'on déroule en cliquant sur ce type de bouton  , ce qui provoque le déroulement d'une liste de liens, en fait comme dans l'image ci-dessous :
Puis en cliquant sur un lien des liens proposés,par exemple sur "grec", on arriverait sur une autre page html (grec.html par exemple), est-ce possible en (X)HTML pur ?
D'avance merci.
Dernière édition par curieuxmann le Mar Déc 16, 2003 23:56; édité 2 fois |
|
| |
|
 |
FightTheWar
Nouveau WRInaute
Inscrit le: 06 Oct 2003
Messages: 21
|
| Posté le : Jeu Déc 11, 2003 19:26 Sujet du message: Menu déroulant en (X)HTML pur avec liens, est-ce possible ? |
|
|
Bonjour,
je ne crois pas que ce soit possible car il faut gérer des événements.
Mais tu peux t'en sortir avec un javascript très limité, ou si tu tiens vraiment à ne pas avoir de javascript, tu mets un bouton submit à côté. Ce qui soit dit en passant permet l'accessibilité aux mal voyant.
Fight. |
|
| |
|
|
curieuxmann
WRInaute discret
Inscrit le: 23 Nov 2003
Messages: 94
|
| Posté le : Jeu Déc 11, 2003 20:11 Sujet du message: Menu déroulant en (X)HTML pur avec liens, est-ce possible ? |
|
|
Bonsoir,
Merci de votre aide.
Où et comment rajouter ce bouton submit ? (Mes pages sont en XHTML 1.0 avec CSS extérieur)
Par exemple dans le code ci-après, comment rajouter ce bonton "submit" ?
| Code: |
<div class="zone_langue">
<div class="langue">Sélectionnez une langue
<select name="langues" size="1">
<option>Toutes les langues</option>
<option value="allemand.html">allemand</option>
<option value="anglais.html">anglais</option>
<option value="arabe.html">arabe</option>
<option value="bulgare.html">bulgare</option>
<option value="catalan.html">catalan</option>
<option value="chinois_simplifie.html">chinois (simplifié)</option>
<option value="chinois_traditionnel.html">chinois (traditionnel)</option>
<option value="coreen.html">coréen</option>
<option value="danois.html">danois</option>
<option value="espagnol.html">espagnole</option>
<option value="estonien.html">estonien</option>
<option value="finnois.html">finnois</option>
<option value="francais.html">français</option>
<option value="grec.html">grec</option>
<option value="hollandais.html">hollandais</option>
<option value="hongrois.html">hongrois</option>
<option value="hébreu.html">indonésien</option>
</select>
</div> |
De plus, mon code source ci-dessous est-il valide selon les normes du W3C, ou bien manque t-'il un ou plusieurs attributs pour pouvoir fonctionner et être valide ?
Encore merci  |
|
| |
|
|
François
WRInaute occasionnel
Inscrit le: 13 Nov 2002
Messages: 231
Localisation: Aix en Provence, 13, France
|
| Posté le : Jeu Déc 11, 2003 20:37 Sujet du message: Menu déroulant en (X)HTML pur avec liens, est-ce possible ? |
|
|
Bonsoir,
Je suppose que tu veux que les robots puissent indexer tes lien ainsi créés ?
Dans ce cas je ne suis pas sûr que ca marche.
En revanche en DHTML tu dois pouvoir le faire avec un bloc comportant les liens et un bouton :
deux classes pour le DIV 1 visible l'autre non
une variable JS visible oui / non,
| Code: |
| var visible = false; |
Un script qui change de classe selon la visiblité :
| Code: |
function affHide ( aBloc ){
visible = not visible;
if visible
{
aBloc.className = maclassevisible;
}
else {
aBloc.className = maclasseinvisible;
}
} |
sur onClick du bouton et des liens affHide ( tonBlock )
J'ai jamais essayé, y a surement à ameliorer, mais c'est une piste !
A+
François |
|
| |
|
|
curieuxmann
WRInaute discret
Inscrit le: 23 Nov 2003
Messages: 94
|
| Posté le : Jeu Déc 11, 2003 21:45 Sujet du message: Menu déroulant en (X)HTML pur avec liens, est-ce possible ? |
|
|
En fait non, les liens contenus dans ce menu ne devront pas être indexés, donc je pense qu'il y a une autre piste en XHTML pur, mais je ne connais pas les éléments et attributs qu'il faut utiliser pour le faire fameux bouton "submit", quelqu'un aurait-il une idée ?
Mais je retiens ton idée pour l'avenir, au cas où. |
|
| |
|
|
curieuxmann
WRInaute discret
Inscrit le: 23 Nov 2003
Messages: 94
|
| Posté le : Jeu Déc 11, 2003 22:14 Sujet du message: Menu déroulant en (X)HTML pur avec liens, est-ce possible ? |
|
|
Pas d'idée  |
|
| |
|
|
StuWee
WRInaute occasionnel
Inscrit le: 26 Juin 2003
Messages: 100
|
|
| |
|
|
François
WRInaute occasionnel
Inscrit le: 13 Nov 2002
Messages: 231
Localisation: Aix en Provence, 13, France
|
| Posté le : Ven Déc 12, 2003 12:59 Sujet du message: Menu déroulant en (X)HTML pur avec liens, est-ce possible ? |
|
|
bonjour !
Sans JS du tout je ne voie pas !!!
Même ca :
| Code: |
<SELECT NAME="Lien" SIZE="1" onchange="window.location.href=this.value">
<option value="allemand.html>allemand</option> |
Ca marche mais c'est du javascript !
(modifié : ca marchait pas avec IE  )
Désolé, pas d'autre idée 
A+
François |
|
| |
|
|
Davios
WRInaute occasionnel
Inscrit le: 01 Sep 2003
Messages: 119
Localisation: Paris
|
| Posté le : Ven Déc 12, 2003 14:19 Sujet du message: Re: Menu déroulant en (X)HTML pur avec liens, est-ce possibl |
|
|
| curieuxmann a écrit: |
| J'aurais voulu savoir s'il était possible de faire des menus déroulants simples avec liens en (X)HTML pur ? (C'est à dire sans Javascript, etc. ?) |
Juste une question, pourquoi tu ne veux absolument pas de JS pour faire ce menu, d'autant plus qu'à peu près ... disons ... 100% des navigateurs le comprendraient tellement le code serait extrêmement simple.
Sinon pour ce qui est du XHTML 1.0, il n'y a aucune restriction vis à vis du javascript, tu peux parfaitement mettre du JS dans ta page et être totalement compatible XHTML. |
|
| |
|
|
FightTheWar
Nouveau WRInaute
Inscrit le: 06 Oct 2003
Messages: 21
|
| Posté le : Ven Déc 12, 2003 15:53 Sujet du message: Menu déroulant en (X)HTML pur avec liens, est-ce possible ? |
|
|
Bonjour,
Il faut mettre ton select dans un form (onligatoire de toute façon pour être valide il me semble) ensuite tu rajoute un bouton submit (ou autre élément submit), ce qui donnerait :
| Code: |
<div class="zone_langue">
<div class="langue">
<form method="post" action="mapage.php" enctype="multipart/form-data" id="post">
Sélectionnez une langue
<select name="langues" size="1">
<option>Toutes les langues</option>
<option value="allemand.html">allemand</option>
<option value="anglais.html">anglais</option>
<option value="arabe.html">arabe</option>
<option value="bulgare.html">bulgare</option>
<option value="catalan.html">catalan</option>
<option value="chinois_simplifie.html">chinois (simplifié)</option>
<option value="chinois_traditionnel.html">chinois (traditionnel)</option>
<option value="coreen.html">coréen</option>
<option value="danois.html">danois</option>
<option value="espagnol.html">espagnole</option>
<option value="estonien.html">estonien</option>
<option value="finnois.html">finnois</option>
<option value="francais.html">français</option>
<option value="grec.html">grec</option>
<option value="hollandais.html">hollandais</option>
<option value="hongrois.html">hongrois</option>
<option value="hébreu.html">indonésien</option>
</select>
<button id="submit" value="submit" type="submit">
</form>
</div>
|
Il ne te reste plus qu'à analyser le formulaire dans "mapage.php" pour faire la bonne redirection, ou le bon include.
Mais comme dis plus haut le plus simple reste quand même est un petit javascript. |
|
| |
|
|
FightTheWar
Nouveau WRInaute
Inscrit le: 06 Oct 2003
Messages: 21
|
| Posté le : Ven Déc 12, 2003 15:57 Sujet du message: Menu déroulant en (X)HTML pur avec liens, est-ce possible ? |
|
|
P.S : voici un bon exemple avec une bonne raison de ne pas utiliser de javascript sur le onchange :
http://www.openweb.eu.org/humeurs/pan_doigts/
Sinon j'ai oublié de fermer la balise button :
| Code: |
| <button id="submit" value="submit" type="submit" /> |
|
|
| |
|
|
François
WRInaute occasionnel
Inscrit le: 13 Nov 2002
Messages: 231
Localisation: Aix en Provence, 13, France
|
| Posté le : Ven Déc 12, 2003 16:32 Sujet du message: Menu déroulant en (X)HTML pur avec liens, est-ce possible ? |
|
|
Non, pas d'accord avec eux, ca marche au clavier avec IE et Mozilla : on peut faire ce qu'on veut, il n'y a que sur changement effectif de la valeur du "Select" que l'évènement est déclenché ! Sur d'autre navigateurs je n'ais pas essayé.
Par contre, en effet, pas d'idexation des moteurs, mais curieuxman avait dit que ce n'était pas nécessaire. Sinon la solution avec un bloc "DIV" doit fonctionner et sera indexable.
Remarque : pas besoin de "Form" à priori, à moins que ce ne soit pas la norme, en tout cas pas de bouton submit.
A+
François |
|
| |
|
|
curieuxmann
WRInaute discret
Inscrit le: 23 Nov 2003
Messages: 94
|
| Posté le : Ven Déc 12, 2003 19:29 Sujet du message: Menu déroulant en (X)HTML pur avec liens, est-ce possible ? |
|
|
Bonsoir,
Excellent l'exemple du menu déroulant du site OpenWeb.
Justement comment ont-ils fait pour faire ce menu accessible aux mal-voyants ?
En regardant leur code source pour ce menu, je ne vois que ça :
| Code: |
<div id="habillage">
<label for="set">Choisir un habillage&:</label>
<select id="set" name="set"><option value="original" selected="selected">Normal</option><option value="fondnoir">Fond noir</option><option value="fondnoir_medium">Fond noir/gros caractères</option><option value="minimale">Minimal</option><option value="sanshabillage">Sans habillage</option></select>
<input type="submit" value="Ok">
</div>
|
Et je suppose que les changements d'apparences sont en fait du aux CSS externers avec le sélecteur habillage placé dans chacune des différentes CSS dont on peut voir le nom et localisation dans l'entête du code source (entre <head> et </head>), à savoir :
| Code: |
<link rel="stylesheet" type="text/css" href="/style/original/screen.css" media="screen" title="Normal" />
<link rel="stylesheet" type="text/css" href="/style/original/print.css" media="print" title="Normal" />
<link rel="alternate stylesheet" type="text/css" href="/style/fondnoir/screen.css" media="screen" title="Fond noir" />
<link rel="alternate stylesheet" type="text/css" href="/style/fondnoir/print.css" media="print" title="Fond noir" />
<link rel="alternate stylesheet" type="text/css" href="/style/fondnoir_medium/screen.css" media="screen" title="Fond noir/gros caract&res" />
<link rel="alternate stylesheet" type="text/css" href="/style/fondnoir_medium/print.css" media="print" title="Fond noir/gros caract&res" />
<link rel="alternate stylesheet" type="text/css" href="/style/minimale/screen.css" media="screen" title="Minimal" />
<link rel="alternate stylesheet" type="text/css" href="/style/minimale/print.css" media="print" title="Minimal" />
<link rel="alternate stylesheet" type="text/css" href="/style/sanshabillage/screen.css" media="screen" title="Sans habillage" />
<link rel="alternate stylesheet" type="text/css" href="/style/sanshabillage/print.css" media="print" title="Sans habillage" />
|
Permettez-moi les remarques ci-dessous, car je ne comprends pas trop vos différentes explications :
Ou voit-on la présence de JS dans le code ci-dessous ? D'une page PHP externe ?
Est-il possible de faire la même chose avec mon menu déroulant, mais à la place de
| Code: |
| <link rel="alternate stylesheet" type="text/css" href="/style/sanshabillage/print.css" media="print" title="Sans habillage" /> |
j'écrirais :
| Code: |
| <link rel="là je ne sais pas ce qu'il faut écrire" type="text/html" href="allemand.html" media="print"* title="allemand" /> |
* cet attribut est optionnel, n'est-ce pas ? C'est un attribut en rapport avec l'impression sur une imprimante je suppose.
D'avance merci pour vos explications, et excusez-moi pour mon insistance, mais c'est important que pour moi, j'aimerais bien arriver à faire un menu comme celui de OpenWeb :
 |
|
| |
|
|
François
WRInaute occasionnel
Inscrit le: 13 Nov 2002
Messages: 231
Localisation: Aix en Provence, 13, France
|
| Posté le : Ven Déc 12, 2003 20:16 Sujet du message: Menu déroulant en (X)HTML pur avec liens, est-ce possible ? |
|
|
Pour OpenWeb :
Le FORM appelle un Fichier php avec comme paramètre le nom du thème,
le php change la feuille CSS par défaut :
avant
| Code: |
<link rel="stylesheet" type="text/css" href="/style/[b]origina[/b]l/screen.css" media="screen" title="Normal" />
<link rel="stylesheet" type="text/css" href="/style/[b]original[/b]/print.css" media="print" title="Normal" />
<link rel="alternate stylesheet" type="text/css" href="/style/fondnoir/screen.css" media="screen" title="Fond noir" /> |
après :
| Code: |
<link rel="stylesheet" type="text/css" href="/style/[b]fondnoir[/b]/screen.css" media="screen" title="Fond noir" />
<link rel="stylesheet" type="text/css" href="/style/[b]fondnoir[/b]/print.css" media="print" title="Fond noir" />
<link rel="alternate stylesheet" type="text/css" href="/style/original/screen.css" media="screen" title="Normal" /> |
Chaque cas est différent,dans l'exemple que je te donne y a du JS eux non.
tu peux aussi transmettre l'URL en paramètre, comme eux, à un script php, asp, dll.. qui fera une redirection.Sinon il faut changer "window.location.href" et c'est du JS, même avec un bouton Submit si c'est plus propre que d'utiliser l'évènement.
Si quelqu'un d'autre à une idée ?
A propos, je corrige ce que j'ai dis tout à l'heure au sujet de 'OnChange' : si la liste est fermée et qu'on utilise les flèches, effectivement ca déclenche ! donc le Submit semble nécessaire.
François |
|
| |
|
|
curieuxmann
WRInaute discret
Inscrit le: 23 Nov 2003
Messages: 94
|
| Posté le : Ven Déc 12, 2003 21:47 Sujet du message: Menu déroulant en (X)HTML pur avec liens, est-ce possible ? |
|
|
Dans ce cas, je suis partant pour un système avec une page PHP externe (?) appellée par l'élément FORM, mais je n'y connais toujours rien au language php !! Que faut-il écrire dans ce fichier php pour que quand l'on choisi allemand dans le menu dérlouant, et puis en cliquant sur OK, le navigateur pointe vers une autre page XHTML nommée allemand.html ? Etc pour les autres liens, (anglais = anglais.html, etc.)
Je pense que dans mes pages HTML, je peux garder ce type de code :
| Code: |
<div id="habillage">
<label for="set">Choisir un habillage&:</label>
<select id="set" name="set"><option value="allemand" selected="selected">Allemand</option><option value="anglais">Anglais
ETC.
<input type="submit" value="Ok">
</div>
|
Par contre, puis-je remplacer <div id="habillage"> par <div class="habillage"> ?
D'avance merci. |
|
| |
|
|
| |
|
|
|
|
Autres sujets de discussion :
|
|
