Menu déroulant en (X)HTML pur avec liens, est-ce possible ?

Discussion dans 'Administration d'un site Web' créé par curieuxmann, 11 Décembre 2003.

  1. curieuxmann
    curieuxmann WRInaute discret
    Inscrit:
    23 Novembre 2003
    Messages:
    90
    J'aime reçus:
    0
    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 [​IMG], ce qui provoque le déroulement d'une liste de liens, en fait comme dans l'image ci-dessous :

    [​IMG]

    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.
     
  2. FightTheWar
    FightTheWar Nouveau WRInaute
    Inscrit:
    6 Octobre 2003
    Messages:
    21
    J'aime reçus:
    0
    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.
     
  3. curieuxmann
    curieuxmann WRInaute discret
    Inscrit:
    23 Novembre 2003
    Messages:
    90
    J'aime reçus:
    0
    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 :D
     
  4. François
    François WRInaute occasionnel
    Inscrit:
    13 Novembre 2002
    Messages:
    270
    J'aime reçus:
    0
    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
     
  5. curieuxmann
    curieuxmann WRInaute discret
    Inscrit:
    23 Novembre 2003
    Messages:
    90
    J'aime reçus:
    0
    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ù.
     
  6. curieuxmann
    curieuxmann WRInaute discret
    Inscrit:
    23 Novembre 2003
    Messages:
    90
    J'aime reçus:
    0
    Pas d'idée :?:
     
  7. StuWee
    StuWee WRInaute discret
    Inscrit:
    26 Juin 2003
    Messages:
    90
    J'aime reçus:
    0
  8. François
    François WRInaute occasionnel
    Inscrit:
    13 Novembre 2002
    Messages:
    270
    J'aime reçus:
    0
    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 :lol: )
    Désolé, pas d'autre idée :(

    A+
    François
     
  9. Davios
    Davios WRInaute discret
    Inscrit:
    1 Septembre 2003
    Messages:
    75
    J'aime reçus:
    0
    Re: Menu déroulant en (X)HTML pur avec liens, est-ce possibl

    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.
     
  10. FightTheWar
    FightTheWar Nouveau WRInaute
    Inscrit:
    6 Octobre 2003
    Messages:
    21
    J'aime reçus:
    0
    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.
     
  11. FightTheWar
    FightTheWar Nouveau WRInaute
    Inscrit:
    6 Octobre 2003
    Messages:
    21
    J'aime reçus:
    0
    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" />
     
  12. François
    François WRInaute occasionnel
    Inscrit:
    13 Novembre 2002
    Messages:
    270
    J'aime reçus:
    0
    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
     
  13. curieuxmann
    curieuxmann WRInaute discret
    Inscrit:
    23 Novembre 2003
    Messages:
    90
    J'aime reçus:
    0
    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 :

    [​IMG]

    ;-)
     
  14. François
    François WRInaute occasionnel
    Inscrit:
    13 Novembre 2002
    Messages:
    270
    J'aime reçus:
    0
    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
     
  15. curieuxmann
    curieuxmann WRInaute discret
    Inscrit:
    23 Novembre 2003
    Messages:
    90
    J'aime reçus:
    0
    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.
     
  16. François
    François WRInaute occasionnel
    Inscrit:
    13 Novembre 2002
    Messages:
    270
    J'aime reçus:
    0
    Salut,

    Là je laisse le soin aux spécialistes du Php de te répondre : je n'y connais rien !

    A+
    François
     
  17. Americas
    Americas WRInaute accro
    Inscrit:
    24 Septembre 2003
    Messages:
    2 587
    J'aime reçus:
    0
    Voili... Voilà :)

    Dans un post que Kmacleod a fermé :wink: ... je me demandais comment faire en sorte que Google voit mes liens dans un menu déroulant :

    Le code était le suivant :

    Dans le Head :
    Dans le Body :
    Menu déroulant simple avec javascript et que Google ne voit pas :roll:
    La solution la plus simple aurait été de rajouter les liens en dur hors du formulaire... mais ça nuirait à la mise en page.

    Alors, quitte à doubler les liens, autant le faire dans le menu déroulant :idea:

    Ce qui donne :

    Et ça marche !!! :D :D :D
     
  18. curieuxmann
    curieuxmann WRInaute discret
    Inscrit:
    23 Novembre 2003
    Messages:
    90
    J'aime reçus:
    0
    Bonsoir,

    Youpi yop !!! C'est exactement cela que je souhaitais !!!

    Je vous remercie profondément pour aide !!

    Et je vois qu'il n'y a rien de compliqué dans ce code, sauf la partie JavaScript pour moi car je ne maitrise malheuresement pas ce language.

    Au fait, est-il possible de mettre le partie Javascript dans un fichier extérieur (comme pour les CSS's avec le <link rel="StyleSheet" type="text/css" href="ma_feuille_de_style.css" />) ?

    Peut-être avec cette balise à placer dans l'entête du document entre les balises HEAD, non ?
    Code:
    <SCRIPT language="javascript" src="fichier.js"></SCRIPT>
    Si je me souviens bien, je crois que cette balise est autorisé en XHTML 1.0 selon les recommandations du W3C.


    D'ailleurs tous les agents-utilisateurs actuels supportent-ils bien le Javascript ? (Au moins les plus courant, à savoir Mozilla, Netscape, IE, Opera, etc.)



    En tout cas c'est parfait, c'est vraiment ce type de truc que je recherchais, je vais tester ça cette fin de semaine, et je vous ferai part des mes remarques.


    Bonne soirée.


    EDIT (22:54'12'') :

    Ah oui, j'avais oublié de vous demander si l'on pouvait faire la même chose mais en intégrant un bouton submit afin de faciliter la navigation au clavier ?
    Code:
    <input type="submit" value="Ok">

    Voilà, voilà, j'attends vos remarques sur ce dernier point...


    Bonne nuit
     
  19. FightTheWar
    FightTheWar Nouveau WRInaute
    Inscrit:
    6 Octobre 2003
    Messages:
    21
    J'aime reçus:
    0
    Bonjour,

    je croyais que tu voulais pas de javascript....

    Sinon la solution que je t'ai proposée au début fonctionne très bien (sans javascript).

    Oui tu peut mettre le javascript dans un fichier externe en y accedant comme dan ton exemple de code, mais si tu veux que ce soit valide XHTML il faut écrire les balises en minuscule.

    Mais vu la simplicité du code mieux vaux l'intégré directement sur les balise. L'exemple donné par americas un un bon départ mais loin d'être valide XHTML (je crois que c'est ce que tu voulais).
     
  20. curieuxmann
    curieuxmann WRInaute discret
    Inscrit:
    23 Novembre 2003
    Messages:
    90
    J'aime reçus:
    0
    Bonjour,

    Oui effectivement je souhaite avoir des pages valides XHTML, mais je ne savais que le code proposé par Americas n'était pas validable par le W3C, mais je veux aussi garder une accéssibilité maximale au clavier.


    Le problème avec la méthode de FightTheWar, c'est la rédaction de la page PHP externe en lien avec ce menu déroulant avec bouton Submit, je ne sais pas utiliser le language de programmation PHP. :?
    Je ne vois vraiment pas quelle syntaxe et propritétés utiliser pour créer cette page PHP. :?

    Quelqu'un aurait-il un exemple d'une telle page PHP ?
     
  21. Americas
    Americas WRInaute accro
    Inscrit:
    24 Septembre 2003
    Messages:
    2 587
    J'aime reçus:
    0
    Le code que je t'ai décris n'est certe pas conforme aux critères... mais si tu me trouves des sites bien placés dans google qui respecte tous les critères, tu me fais signe :lol:

    Je crois qu'il faut savoir prendre quelques libertés pour débloquer certaines situations, du momment que les pages restent accessibles à la fois par les utilisiateurs et les robots :wink:
     
  22. George Abitbol
    George Abitbol WRInaute passionné
    Inscrit:
    6 Juin 2003
    Messages:
    1 536
    J'aime reçus:
    0
    Moi j'en connais au moins un ;)

    Fred
     
  23. curieuxmann
    curieuxmann WRInaute discret
    Inscrit:
    23 Novembre 2003
    Messages:
    90
    J'aime reçus:
    0
    Je suis bien d'accord avec toi, mais il aurait quand même été intéressant de voir un exemple de code php avec la méthode proposée par FightTheWar, non ? :)
     
  24. Americas
    Americas WRInaute accro
    Inscrit:
    24 Septembre 2003
    Messages:
    2 587
    J'aime reçus:
    0
    Le W3C ? :wink:
     
  25. George Abitbol
    George Abitbol WRInaute passionné
    Inscrit:
    6 Juin 2003
    Messages:
    1 536
    J'aime reçus:
    0
    Bon ben ça en fait 2, alors :D

    Fred
     
  26. FightTheWar
    FightTheWar Nouveau WRInaute
    Inscrit:
    6 Octobre 2003
    Messages:
    21
    J'aime reçus:
    0
    Bonjour,

    américas > d'accord avec toi, les règles du w3c ne sont pas dorcement applicable à la lettre. Mais par rapport à ton exemple mettre les noms de balise en minuscule et fermé les balises je ne pense pas que ça change quoi que ce soit au positionnement google, ni même mettre une method sur le form.

    curieuxmann > voici le code valide XHTML, sans javascript et complet (redirection PHP incluse) :

    Code:
    <form method="post" action="redirection.php" enctype="multipart/form-data" id="post">
    <fieldset>
    <legend>Sélectionnez une langue</legend>
    <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">Ok</button>
    </fieldset>
    </form>
    
    Ensuite il te faut créer une page redirection.php à placer dans le même repertoire avec comme contenu :

    Code:
    <?php
    header("Location: ".$_POST['langues']);
    ?>
    
    A toi de l'adapter selon tes besoins, j'espère que ça convient à tes attentes.
     
  27. Americas
    Americas WRInaute accro
    Inscrit:
    24 Septembre 2003
    Messages:
    2 587
    J'aime reçus:
    0
    Moi je donnais ce code uniquement pour un problème d'indexation et non de positionnement.

    Je m'étais rendu compte qu'un menu déroulant classique n'étais pas vu par Google et que les pages contenus dans ce menu n'étaient pas indexées... alors il fallait trouver un moyen de les faire apparaître.

    Mais il est clair que si je recherchais un meilleur positionnement sur ces pages... je placerais les liens autrement :wink:
     
  28. curieuxmann
    curieuxmann WRInaute discret
    Inscrit:
    23 Novembre 2003
    Messages:
    90
    J'aime reçus:
    0
    Bonsoir,

    Faut-il toujours mettre le code php dans une feuille externe (ici redirection.php) ?
    Edition : non !!! (j'ai lu un peu phpdébutant)

    Ou bien puis-je l'intègrer directement dans ma page XHTML ? (Parce que juste pour une ligne de code, ce n'est peut-être pas la peine de créer une page externe)
    Edition: oui !!!

    Mais comment pour mon menu, je ne chez pas pour l'instant...


    Par contre le ne vois pas pourquoi utiliser l'élément FIELDSET pour un formulaire ne contenant qu'un champ (ici Sélectionnez une langue).
     
  29. George Abitbol
    George Abitbol WRInaute passionné
    Inscrit:
    6 Juin 2003
    Messages:
    1 536
    J'aime reçus:
    0
    En fait ça revient plus ou moins au même, puisque de toute façon le nouveau fichier ne ferait qu'une ligne lui aussi... Si tu veux mettre ce code sur la page qui contient le menu, alors tu dois :

    - faire pointer le formulaire sur cette même page (ou ne pas définir d'attribut action, puisque par défaut c'est la page en cours qui sera utilisée)
    - rajouter un test pour savoir si le formulaire a été envoyé et le cas échéant faire la redirection (sinon la redirection se ferait dès le 1er chargement de la page)

    Ce test pourrait ressembler à ça (en se basant sur le formulaire de FightTheWar) :

    Code:
    <?php
    if ( (isset($_POST['langues'])) && ($_POST['langues'] != '') ) {
         header('Location: '.$_POST['langues']);
    }
    ?>
    
    Tu peux mettre ça n'importe où dans le document puisque de toute façon ce sera exécuté avant que la page ne soit envoyée au navigateur, mais bon, dans l'idéal, il vaut mieux le mettre tout en haut, tu t'y retrouveras plus facilement.

    Fred
     
  30. curieuxmann
    curieuxmann WRInaute discret
    Inscrit:
    23 Novembre 2003
    Messages:
    90
    J'aime reçus:
    0
    Peut-on même mettre ce code PHP entre les balises d'entête HEAD ?



    Et ne peut-on pas aussi rajouter l'élément A dans l'exemple de FightTheWar, afin de permettre l'indexation par Google des liens hypertextes, comme dans l'exemple ci-dessous :

    Code:
    <form method="post" action="" enctype="multipart/form-data" id="post">
    <fieldset>
    <legend>Sélectionnez une langue</legend>
    <select name="langues" size="1">
    <option>Toutes les langues</option>
    <option value="allemand.html"><a href="allemand.htm">allemand</a></option>
    <option value="anglais.html"><a href="anglais.html">anglais</a></option>
    <option value="arabe.html"><a href="arabe.html">arabe</a></option>
    <option value="bulgare.html"><a href="bulgare.html">bulgare</a></option>
    [...]
    </select>
    <button id="submit" value="submit" type="submit">Ok</button>
    </fieldset>
    </form> 

    Ou bien ça ne marche pas avec du PHP ?
     
  31. George Abitbol
    George Abitbol WRInaute passionné
    Inscrit:
    6 Juin 2003
    Messages:
    1 536
    J'aime reçus:
    0
    Je te l'ai dit, tu peux le mettre n'importe où. Pour la simple et bonne raison que la redirection se fera en premier, le code HTML ne sera jamais affiché dans le navigateur, et la notion même de HEAD ou de BODY n'a plus aucun sens. C'est une redirection faite côté serveur, la page pourrait ne contenir que le header() ou bien contenir 8 000 lignes de code HTML derrière, devant, ou autour, ça ne changerait strictement rien, ce code ne serait jamais envoyé au navigateur, à l'internaute ou au robot.

    PHP n'a rien à voir ici, mais ce code n'est tout simplement pas valide (pas de A dans une OPTION)

    Si tu veux que les moteurs indexent ces liens, il te suffit de faire une page plan du site, ou bien d'ajouter ces liens en dur en bas de ton document.

    Fred
     
  32. Fabrice P.
    Fabrice P. Nouveau WRInaute
    Inscrit:
    30 Juillet 2003
    Messages:
    36
    J'aime reçus:
    0
    Pour revenir à la toute première question, il est possible de faire un menu déroulant en HTML et CSS.

    Si tu prends le code source de mon site (voir le WWW) tu auras un exemple.

    Sinon tu cherches sur Googles ;-) : menu CSS HTML
     
  33. curieuxmann
    curieuxmann WRInaute discret
    Inscrit:
    23 Novembre 2003
    Messages:
    90
    J'aime reçus:
    0
    Oui Fabrice P. je sais, mais il y a des problèmes avec IE quand on utilise des CSS pour faire ce type de menus. Enfin c'est ce que j'ai lu sur un autre site...
     
  34. curieuxmann
    curieuxmann WRInaute discret
    Inscrit:
    23 Novembre 2003
    Messages:
    90
    J'aime reçus:
    0
    Et que faut-il rajouter pour que dans le menu déroulant le lien de la page actuellement active soit grisé et sans effet ?

    Ne mettre pas mettre de valeur pour l'attribut option ?

    Comme ça :
    Code:
    <option value="">anglais</option>
    Et pour griser, le pense que l'on peut utiliser un sélecteur de classe dans une CSS, non ?

    Genre :
    Code:
    gris { color: 666666; }
    Code:
    <option class="gris" value="">anglais</option>

    Ou plus simplement :

    Code:
    <option class="gris">anglais</option>
    C'est valide ça en XHTML strict ?


    Ou bien je suis à côté de la plaque là ou pas ?
     
  35. George Abitbol
    George Abitbol WRInaute passionné
    Inscrit:
    6 Juin 2003
    Messages:
    1 536
    J'aime reçus:
    0
    Ceci n'empêchera pas de sélectionner l'option, mais effectivement aucune redirection n'aura lieu (avec mon bout de code, en tous cas). Ce qui ne change rien du tout en fait, puisque de toute façon il faudra recharger la page via le formulaire.

    - option avec value de la page courante = redirection vers la page courante (donc on ne bouge pas)
    - option sans value = pas de redirection, on reste sur la page courante (donc on ne bouge pas)

    Complètement valide. D'ailleurs, je ne sais pas si tu sais, mais il existe un validateur, ça te permettra de répondre toi-même à ce genre de questions (même pas besoin de mettre le fichier en ligne, ça marche aussi sur un fichier local). ;)

    Seulement là encore ce n'est pas parce que l'option est grise qu'elle sera non-sélectionnable. Le plus simple serait de ne pas l'afficher, non ?

    Fred
     
  36. curieuxmann
    curieuxmann WRInaute discret
    Inscrit:
    23 Novembre 2003
    Messages:
    90
    J'aime reçus:
    0
    Erreur 405 !!

    J'ai utilisé la méthode de FightTheWar avec le code PHP proposé par George Abitbol :

    Code:
    <form method="post" action="" enctype="multipart/form-data" id="post">
       <legend>S&lectionnez un groupe :</legend>
        <select name="groupes" size="1">
        <option>S&lectionnez un groupe :</option>
        <option class="gris">AA</option>
        <option value="../../groupes/ab/groupe_ab.html">&&&AB</option>
        <option class="gris">AC</option>
        <option class="gris">AD</option>
        <option class="gris">AE</option>
        [...]
        </select>
        <button id="submit" value="submit" type="submit">Ok</button>
       </form>
    
    Code:
    <?php
       if ( (isset($_POST['groupes'])) && ($_POST['groupes'] != '') ) { header('Location: '.$_POST['groupes']);
       }
       ?>
    Mais j'ai une erreur 405 :


    Que faire ??
     
  37. George Abitbol
    George Abitbol WRInaute passionné
    Inscrit:
    6 Juin 2003
    Messages:
    1 536
    J'aime reçus:
    0
    Ca veut dire que ton serveur n'est pas configuré pour autoriser la méthode POST sur les fichiers .html. De toute manière, puisque tu comptes utiliser du PHP dessus, ce fichier doit donc être un fichier PHP et pas un fichier HTML ;)

    Si tu ne veux pas toucher à ce fichier, envoie les données du formulaire sur un fichier php.

    Fred
     
  38. curieuxmann
    curieuxmann WRInaute discret
    Inscrit:
    23 Novembre 2003
    Messages:
    90
    J'aime reçus:
    0
    Bonjour,

    Maintenant ça marche comme je le souhaitais, c'est super !

    Encore merci à vous tous pour vos aides, et en particulier à George Abitbol pour ses propositions de code PHP que j'utilise à présent.


    Bon weekend.
     
  39. bratschi
    bratschi Nouveau WRInaute
    Inscrit:
    14 Février 2008
    Messages:
    1
    J'aime reçus:
    0
    Bonjour, ceci est le premier message d'un débutant.
    J'enseigne trois disciplines dans un lycée et j'aimerais insérer un menu déroulant avec lien ( sans exigence particulière sur HTML pur ou non ) pour permettre à mes élèves d'être dirigés directement sur la page qui les concerne spécifiquement.

    Voici le code proposé, basé sur les réponses trouvées plus haut dans cette discussion:


    <div class="disciplines">
    <form method="post" action="mapage.php" enctype="multipart/form-data" id="post"> <select name="disciplines" size="1">
    <option value="Maths.html">Maths</option>
    <option value="Physics.html">Physics</option>
    <option value="Tc.html">TC</option>
    </select><button id="submit" value="submit" type="submit">
    </form>
    </div>


    questions:

    Si j'ai bien compris, ce code envoie le choix d'option dans "mapage.php"
    Comment récupérer cette information ?
    Peut-on la récupérer facilement sans connaissance de php ? si oui comment ?
    Ne peut-on pas bricoler directement une URL à partir de : options values="choix.html" ?

    merci d'avance.
     
Chargement...
Similar Threads - Menu déroulant (X)HTML Forum Date
problème lien menu deroulant sur wix Demandes d'avis et de conseils sur vos sites 23 Janvier 2019
Mieux vaut-il un select ou un menu déroulant CSS Développement d'un site Web ou d'une appli mobile 15 Mars 2017
Vers la fin du menu déroulant? Administration d'un site Web 17 Avril 2016
Question sur menu déroulant Développement d'un site Web ou d'une appli mobile 20 Janvier 2016
Récupération des données d'un menu déroulant en HTML Développement d'un site Web ou d'une appli mobile 22 Septembre 2015
Comment faire pour avoir ce menu déroulant sur Bing Référencement Bing 21 Avril 2015
Mon ménu déroulant décale tous les éléments qui se trouvent après Développement d'un site Web ou d'une appli mobile 18 Janvier 2015
Fermer OnMouseOver menu déroulant Développement d'un site Web ou d'une appli mobile 18 Novembre 2014
Niveau et importances des URL dans menu déroulant Débuter en référencement 28 Juillet 2014
menu déroulant qui ne fonctionne pas Développement d'un site Web ou d'une appli mobile 18 Juin 2014
  1. Ce site utilise des cookies. En continuant à utiliser ce site, vous acceptez l'utilisation des cookies.
    Rejeter la notice