Menu dynamique SPIP vertical en CSS et Javascript

Comment afficher beaucoup d’informations provenant de la base de donnée dans un espace restreint vertical ? Une solution, les css couplées à du javascript.

-  Pour la petite hitoire, cette contribution vient du fait d’une problèmatique qui m’est apparue sur un site que j’administre ou un menu vertical dynamique (actionscript) en flash affiché des informations qui étaient inscrites en dure dans le fichier .fla. Très sympatique, mais sans réelle dynamique puisque pas connecté à la base de donnée. Vous imaginez bien le problème si il y a un changement dans les intitulés des noms des articles, ou sous rubriques disposées dans ce menu.

Les fichiers joints à cet articles vous permettent d’étudier le menu, ils ne seront surement pas adaptés à votre charte, of course, mais quelques petites modifs dans le fichier CSS et la page menu.html vous permettront de le réadapter sans trop de problème.

  • Vous pouvez aussi faire un include dans vos pages de la page menu.php3
  • J’ai donc réadapter ce menu en CSS et javascript en n’y insérant les boucles SPIP, les explications détaillées et les sources d’origines sont ici : www.alsacreations.com.

Extension Menu pour Dreamweaver (full version) : extension dreamweaver pour développer des menus (les sources www.dmxzone.com)

Discussion

6 discussions

  • 1

    Bonjour,
    Je viens d’installer très facilement le menu.

    Cependant je voudrais faire 2 modifications qui restent pour le moment sans résultats :

    1. Je voudrais que les menus déroulants le soient après un clic de souris. J’ai utilisé le « onclick » sur les rubriques déroulantes en enlevant l’url rattachée (pour éviter d’aller sur le lien spip) mais ça ne fonctionne pas.

    2. Et ensuite je voudrais savoir s’il est possible qu’à l’ouverture de la page les sous-menus ne soient pas déroulés ?

    Merci d’avance pour votre aide

    • Pour répondre au second point, essaie avec la ligne de commande suivante :

      window.onload=fonction() ;

      où fonction va faire un style.display=’none’ sur chaque élément.

    Répondre à ce message

  • Salut !
    Cela fait plusieur heure que je m’acharne à modifier le code de ce menu pour obtenir 3 niveau de hiérarchie (rubrique—>sous-rubrique—>article) ... en vain !!
    Quelqu’un peut-il m’apporter la lumière ???

    Je pense que le chisme vient du code javascript

    Répondre à ce message

  • Perso j’utilise le menu adapter de cyril vidal
    planetexml
    Les utilisateurs dans la phase de test de mon site ne se sont pas plaint du menu (du moins pas encore).

    Tester sous IE 5, 6 sp1, firebird, opéra 7 > OK
    opéra 6 > NOK

    Répondre à ce message

  • annabelle

    pareil cela bogue sous IE6 win2K : les sous menus sont invisibles

    je prefere celui propose sur mm site spip EDF particulier
    qui est bien optimise

    Répondre à ce message

  • Ces menus DHTML qui « sautent » ne sont pas top en terme d’ergonomie...

    Je préfère celui-là.

    Le design CSS est sympa par contre

    Tjos :)

    Répondre à ce message

  • magnifique ! les menus dynamiques en spip ne sont pas evident à bosser quand on connait pas le php, alors : bravo !

    Répondre à ce message

Ajouter un commentaire

Avant de faire part d’un problème sur un plugin X, merci de lire ce qui suit :

  • Désactiver tous les plugins que vous ne voulez pas tester afin de vous assurer que le bug vient bien du plugin X. Cela vous évitera d’écrire sur le forum d’une contribution qui n’est finalement pas en cause.
  • Cherchez et notez les numéros de version de tout ce qui est en place au moment du test :
    • version de SPIP, en bas de la partie privée
    • version du plugin testé et des éventuels plugins nécessités
    • version de PHP (exec=info en partie privée)
    • version de MySQL / SQLite
  • Si votre problème concerne la partie publique de votre site, donnez une URL où le bug est visible, pour que les gens puissent voir par eux-mêmes.
  • En cas de page blanche, merci d’activer l’affichage des erreurs, et d’indiquer ensuite l’erreur qui apparaît.

Merci d’avance pour les personnes qui vous aideront !

Par ailleurs, n’oubliez pas que les contributeurs et contributrices ont une vie en dehors de SPIP.

Qui êtes-vous ?
[Se connecter]

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici

Ce champ accepte les raccourcis SPIP {{gras}} {italique} -*liste [texte->url] <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Ajouter un document

Suivre les commentaires : RSS 2.0 | Atom