Vous voulez de plus qu’il soit full CSS, compliant W3C, sans tableaux, sans trop de javascript, et surtout compatible avec tous les navigateurs du marché...
Mais vous n’avez que 5 minutes pour le mettre en place, sinon, votre patron vous vire ?
Le père Noël a pensé à vous !
Installation
Téléchargement : Récupérer le zip « menu_deroulant » sur l’espace de téléchargement, ou le miroir, de spip-zone, cf. rubrique Produits finis
Mise en œuvre : Comme tous les autres plugins, cf. https://www.spip.net/fr_article3396.html
Pour installer ce plugin de menu déroulant, copier le contenu du zip dans le dossier plugins à la racine de votre site. Recopier le fichier inc-menu-deroulant.html ainsi que le fichier menu_deroulant.css dans votre dossier de squelettes. Cela vous permettra éventuellement de le personnaliser à souhaît, et surtout, de ne pas l’écraser ou le perdre lors d’une future mise à jour.
Versions inférieures à SPIP 1.9.2
Si vous êtes sur une version de SPIP antérieure à la 1.9.2, il vous faudra aussi installer le plugin jquery. La partie javascript initiale du script a en effet été réécrite en jquery pour assurer une parfaite compatibilité avec internet explorer.
Au delà de la 1.9.2, il sera inutile d’installer jquery, celui-ci a été intégré au core.
Dans vos squelettes
Il faudra aussi vous assurer que votre squelette a bien dans son entête la fameuse balise #INSERT_HEAD, celle qu’on trouve dans le inc-head.html de la dist, balise permettant aux plugins d’insérer des appels javascript ou css. C’est un script PHP du plugin qui se charge d’insérer le script javascript pour internet explorer et la feuille de style. Par conséquent, même si le javascript a été désactivé, le menu fonctionnera sur tous les navigateurs sauf ie, qui lui devra se servir du petit script en jquery.
Insérer la noisette de menu déroulant où bon vous semble dans votre squelette (généralement en haut de page, en dessous du bandeau) par un inclure :
<INCLURE{fond=inc-menu-deroulant}{lang}>
Exemple
L’auteur de plugin nous fournit par ailleurs un squelette sommaire de la dist avec le menu déroulant en inclure, à titre d’exemple, pour que vous vous rendiez compte de ce que ca peut donner.
C’est le fichier menuder_sommaire_demo.html.
Pour l’appeler et le tester
http://www.monsitespip.net/spip.php?page=menuder_sommaire_demo
Et voilà le tour est joué !
Personnalisation
Pour personnaliser votre menu, vous pouvez modifier quelques lignes du fichier menu_deroulant.css :
la ligne :
[*border: solid #eda;*]
sous
[*#nav, #nav ul*] vous permet de régler la couleur des lignes entourant le menu.
La ligne [*background: #eda;*] sous [*#nav li:hover, #nav li.sfhover *] vous permet de régler la couleur de fond des items survolés.
Toutefois, notez que pour les changements de CSS, il faut y aller tout doucement, notamment à cause de l’éternelle problématique internet explorer. La feuille de style a été calibrée de façon très précise. Donc, pour plus de sûreté, nous vous conseillons de ne changer que les couleurs, ou de modestes petites choses, ca vous évitera bien des déconvenues. Ne pas trop jouer, à moins d’être un pro de la css qui connaît tous les mauvais tour d’internet explorer, sur les padding, les margin, les positions et sur les tailles etc...
Pour en savoir plus
Pour les petits curieux qui voudraient savoir d’où l’auteur a puisé son inspiration pour cette merveille de petit plugin, allez voir sur le site de htmldog. Il a remplacé toute sa partie javascript en jquery, et surtout trouvé la boucle qu’il fallait pour le rendre dynamique et non plus simplement statique.
On ne peut s’empécher de mettre ici cette boucle récursive, tant elle est belle et bien pensée :
<B_rubriques>
<ul>
<ul>
<BOUCLE_rubriques(RUBRIQUES) {racine} {par num titre, titre}>
<li>
<a href="#URL_RUBRIQUE"class="intitule">[(#TITRE|supprimer_numero|couper{80})]</a>
<B_sous_rubriques>
<ul>
<BOUCLE_sous_rubriques(RUBRIQUES) {id_parent} {par num titre, titre}>
<li>
<a href="#URL_RUBRIQUE" <BOUCLE_test_sousrub(RUBRIQUES){id_parent}{0,1}>class='daddy'</BOUCLE_test_sousrub>>[(#TITRE|supprimer_numero|couper{80})]</a><BOUCLE_re(BOUCLE_sous_rubriques)></BOUCLE_re> </li>
</BOUCLE_sous_rubriques>
</ul>
</B_sous_rubriques>
</li>
</BOUCLE_rubriques>
</ul>
</ul>
</B_rubriques>Toute l’originalité de ce plugin est d’avoir trouvé la boucle qu’il fallait avec le meilleur exemple de menu déroulant qu’on puisse trouver. En effet,
ceux d’Alsa Création, par exemple, utilisaient les listes de définitions et se limitaient à deux niveaux. Cf http://css.alsacreations.com/xmedia....
On pourrait très certainement aussi arriver à pluginiser les modèles de menus déroulants proposés par CSSplay.
Discussions par date d’activité
57 discussions
J’utilise le SPIP 2.1.0
Quels sont les fichiers qu’il faudra modifier pour passer d’un sommaire à la verticale droite à un menu de navigation placé en haut du site à l’ horizontal
Merci
Répondre à ce message
La dernière version 0.1.0 n’est plus compatible avec spip SPIP 2.1.11 [18566]
Il existe le menuderoulant 2 :)
c’est ce que j’ai fait. Merci.
Répondre à ce message
Bonjour,
La version compatible avec Spip 2 tant attendue est-elle sur le point d’être publiée ?
Répondre à ce message
Même question qu’Arnaud, je serais très preneur du version pour Spip2, et je n’y connais rien en plug-in pour l’adapter moi-même !
Ah, ben tiens, moi aussi ! Avant de prendre 3 jours à essayer pour rien, un petit mot (juste oui ou non ;-) serait le bienvenu.
Merci d’avance.
Ce plugin est-il compatible SPIP 2.0.x ? (Je préfère poser la question http://phpforms.net/tutorial/tutorial.html php tutorial .... ;-) )
Il suffit d’essayer pour se rendre compte que oui, ce plugin fonctionne toujours sous SPIP 2. Ceci dit, une mise à jour vient d’être faite : Menu déroulant 2.
tetue, ton lien n’est plus valide.
Répondre à ce message
Pour changer les couleurs, ça se fait dans menu_deroulant.css (il vaut mieux en mettre une copie dans le dossier /squelettes).
Pour la couleur de fond fixe, modifier ’background’ dans #nav, #nav ul
Pour la couleur de survol, modifier ’background’ dans #nav li:hover, #nav li.sfhover
Il peut aussi être nécessaire de rajouter un z-index (à 2 par ex) dans #nav-container si les blocs dépliants sont recouverts par certains blocs de la page (ça m’est arrivé).
Enfin le plugin fonctionne nickel dans spip 2.1 car il ne contient que du spip.
D’ailleurs si tu veux exclure des rubriques, il suffit de modifier la boucle du squelette inc-menu_deroulant.html (en en faisant là encore une copie dans /squelettes).
Je l’ai fait en utilisant un mot-clé ’exclure_menu’ pour plus de souplesse.
Répondre à ce message
Bonjour,
J’ai trouvé interressant ce plugin. J’essai de modifié la couleur du lien au survol mais ça ne passe pas.
J’aimerais savoir comment exclus certaines rubriques dans le menu ?
Merci
Répondre à ce message
Bonjour,
Beau travail.
Cet excellent menu pourrait-il être adapté en version « Menu vertical » ?
Cordialement
FDG
Bonjour,
En ce sens, la contribution d’ Asteroiide pourrait-elle être publiée et mise à disposition sur cette page.
Et, cerise sur le gâteau, puisqu’aujourd’hui l’ergonomie moderne en raffole, en versions :
Cordialement
FDG
Répondre à ce message
je débute avec spip : pouvez-vous me renseigner pour savoir dans quel fichier coller pour que ce la fonctionne ?
merci
Répondre à ce message
Bonjour
Je viens juste de migrer un site spip de 1.9.2 vers 2.0.10 [14698] : je pensais que le plugin allait me lacher mais non.
Il fonctionne correctement ;-)
Merci !
Répondre à ce message
Ce plugin est-il compatible SPIP 2.0.x ? (Je préfère poser la question AVANT.... ;-) )
Répondre à ce message
Bonjour. Le menu horizontal est très bien, seulement il ne s’affiche que sur ma page d’accueil, et une fois que je clic sur une sous rubrique celui ci disparait !
Comment faire pour qu’il s’affiche sur toutes les pages ?
Répondre à ce message
Perso, sans vouloir porter préjudice au travail présenté ici (merci beaucoup), j’ai testé celui proposé ici : http://www.spip-contrib.net/Babbibel,1225
Franchement, moi, ça me convient très bien.
Merci pour ce plugin !
Personnellement, j’ai modifié le css afin de le rendre vertical (il déroule à droite) et je n’ai pas eu de problèmes.
J’avais essayé sans succès avec le menu babbibel : un problème de z-index sur les sous-rubriques avec IE7.
Donc encore merci pour ce plugin compatible avec les principaux navigateurs.
Ben si Asteroiide pouvait m’envoyer sa page css pour un déroulement vertical, je suis preneur. J’ai le même problème que lui avec babbibel.
Merci
Répondre à ce message
Bonjour
Ce plugin me serait bien utile, mais j’aimerais qu’il finisse par la liste des titres des articles contenus dans la sous-sous-rubrique (enfin, moi, je n’ai pas de sous-rubriques, mais bon...)
J’ai essayé de modifier la boucle mais je n’y connais rien...pas de message d’erreur, mais pas de modification dans le résultat non plus ;-)
Pouvez-vous m’aider ?
Répondre à ce message
Bon vu les explications même si il y a pas de démonstration j’imagine que ça donne quelquechose comme ça http://www.htmldog.com/articles/suc...
Y a t il un moyen jquery de mettre un timer sur ce menu pour empêcher qu’il se ferme trop facilement dés que la souris sors des bord ? un petit délais de 500ms avant disparition du menu faciliterait énormément la navigation... [edit] : ya ça peut être plutôt : http://users.tpg.com.au/j_birch/plu...
Répondre à ce message
Salut,
Ce plugin fonctionne impeccablement sous Spip 1.9.2.
Est-il compatible avec la version 2.0 ?
Amicalement.
Arnaud
A priori pas de problème avec SPIP 2.0. Le plugin repose simplement sur des boucles, des css et 2 doigts de jquery, donc cela doit marcher sans soucis !
Répondre à ce message
Bonjour
beaucoup de questions et peu de réponses...!
et voici une question supplémentaire :
j’utilise ce plugin qui marche plutot bien, sauf sous opera, ou au survol de la souris, les sous-rubriques chevauchent les rubriques principales. Pas de pb sous Firefox, Safari et IE, mais avec Opera ça bug... si quelqu’un a une astuce ?
merci
valérie
Répondre à ce message
Bonjour à tous,
J’ai installé ce menu déroulant qui répond exactement à ce que je cherche, mais ce dernier va se loger sous mon bandeau d’entête de site. Je ne comprends pas comment y remédier. Merci beaucoup pour votre aide.
J’utilise la version SPIP2 + squelette AHUNTSIC
Merci pour votre aide
Répondre à ce message
Bonjour,
Le menu marche en effet très bien, mais y-a-t’il un moyen, au clic sur une rubrique, de renvoyer vers une page spip avec un CSS appliqué, car quand j’utilise le menu, les pages spip « standard » s’affichent.
Répondre à ce message
Bonjour,
Sous firefox le plugin fonctionne nickel
mais sous IE7, toutes les ssrubriques qui se deroulent au survol restent affichées : elles ne se referment pas !
Du coup toutes les ssrubriques deroulantes sont ouvertes et se chevauchent quand on survole le menu avec la souris.
C’est comme si le masquage du hover (left, -999em) ne fonctionnait pas sous IE !
Auriez vous une piste ?
Autres plugins installés :
- Couteau suisse (insert head)
- CFG
- Définitions mots
- Recherche avancée
Version de SPIP : 1.9.2c
Merci de votre aide.
Répondre à ce message
Bonsoir,
J’aimerai savoir si avec se plugin, il était possible d’organiser ses rubriques dans l’ordre que l’on souhaite ? Car par défaut, les rubriques sont classées par ordre alphabétique, ce qui est très génant. Peut-être que cela est paramétrable directement dans la zone d’administration de spip ? Mais pour le moment je n’ai pas trouvé cette fonctionnalitée.
Pouvez-vous m’aider, merci d’avance
Répondre à ce message
Juste un petit comment pour remercier et dire que ce plugin fonctionne très bien sous 1.9.2.
Personnalisable à souhait grâce à sa css. Que du bonheur ! Merci les chef(e)s
Répondre à ce message
Bonjour,
Je souhaiterais que les noms des rubs lorsqu’ils sont un peu long
apparaissent sur une seule ligne, sans retour.
Je cherche bien dans le CSS, mais pour l’instant rien d’efficace.
Si quelqu’un a solutionner ce pb, minime j’imagine,
merci d’avance.
Scal
Je me réponds, mais ce n’est pas la solution.
Si je place mon nom de rub entre les balises obsolètes
ça marche, le nom est bien sur une seule ligne, mais il chevauche le nom de la rub suivante... ; (
Ma question est toujours pas résolue...
Répondre à ce message
Bonjour,
j’ai un soucis de compatibilité de ce plugin avec le plugin diaporama_innerfade (javascript également) : le menu se place en dessous du diaporama et devient inutilisable.
J’ai tenté de rajouter un z-index:2 ; dans le css du menu et z-index:1 ; dans le css du diaporama mais rien n’y fait : une idée ?
Merci d’avance !
Répondre à ce message
Le menu marche super sous firefox mais absolument pas sous IE6. cela vient forcément du code CSS car le code d’origine marche à peu près, seulement j’en ai récup un sur le site proposé, mais les sous rubriques ne se déroulent pas... Voici mon code CSS, si ça peut aider :
#nav
float:left ; width:100% ; font-family : verdana, arial, sans-serif ; font-size:11px ;
background:white ;
border-top:3px solid #4c597f ; border-bottom:3px solid #4c597f ;
margin:0 0 20px 0 ; /* for this demo only */
#nav ul
padding:0 ;margin:0 ;list-style-type:none ;
#nav ul li
float:left ; position:relative ; background:url(images/divider1.gif) no-repeat top right ;
#nav ul li a, #nav ul li a:visited
float:left ; display:block ; text-decoration:none ;color :#ddf ; padding:0px 16px ; line-height:25px ; height:30px ; border-bottom:3px solid #fff ;
#nav ul li:hover width:auto ;
#nav ul li a:hover border-color :#c00 ; color :#f88 ;
#nav ul li:hover a border-color :#c00 ; color :#f88 ;
#nav ul li ul
display : none ;
#nav table
margin:0 ; border-collapse:collapse ; font-size:11px ; position:absolute ; top:0 ; left:0 ;
/* specific to non IE browsers */
#nav ul li:hover ul
display:block ;position:absolute ;top:32px ;margin-top:1px ; left:0 ;width:154px ;border-bottom:1px solid #000 ;
#nav ul li:hover ul.endstop
left :-92px ;
#nav ul li:hover ul li ul
display : none ;
#nav ul li:hover ul li a
display:block ;background :#fff ;color :#000 ;height:auto ;line-height:15px ;padding:4px 16px ; width:120px ; border:1px solid #000 ; border-bottom:0 ;
#nav ul li:hover ul li a.drop
background :#ccd url(images/bullet1.gif) no-repeat 3px 8px ;
#nav ul li:hover ul li a:hover
color :#000 ; background : #ccd url(images/bullet1.gif) no-repeat 3px 8px ;
#nav ul li:hover ul li a:hover.drop
background : #ccd url(images/bullet1.gif) no-repeat 3px 8px ;
#nav ul li:hover ul li:hover ul
display:block ; position:absolute ; left:153px ; top :-1px ;
#nav ul li:hover ul li:hover ul.left
left :-153px ;
/* specific to IE5.5 and IE6 browsers */
#nav ul li a, #nav ul li a:visited height:33px ;
#nav ul li a:hover ul
display:block ;position:absolute ;top:30px ; t\op:33px ; background :#fff ;left:0 ; border-bottom:1px solid #000 ;
#nav ul li a:hover ul.endstop
left : -92px ;
#nav ul li a:hover ul li a
display:block ;background :#fff ;color :#000 ; height:1px ; line-height:15px ; padding:4px 16px ; width:154px ; w\idth:120px ; border:1px solid #000 ; border-bottom:0 ;
#nav ul li a:hover ul li a.drop
background :#ccd url(images/bullet1.gif) no-repeat 3px 8px ; padding-bottom:4px ;
#nav ul li a:hover ul li a ul
visibility:hidden ; position:absolute ; height:0 ; width:0 ;
#nav ul li a:hover ul li a:hover
color :#000 ; background : #ccd url(images/bullet1.gif) no-repeat 3px 8px ;
#nav ul li a:hover ul li a:hover.drop
background : #ccd url(images/bullet1.gif) no-repeat 3px 8px ;
#nav ul li a:hover ul li a:hover ul
visibility:visible ; position:absolute ; top:0 ;color :#000 ; left:153px ;
#nav ul li a:hover ul li a:hover ul.left
left :-153px ;
Moi j’ai résolu le problème d’IE <=6 avec les « conditional comments » ; ça marche très bien :
Répondre à ce message
Salut,
J’aimerais que lorsque l’on se trouve dans un secteur, le background de mon secteur courant ai une couleur différente des background des autres secteurs. Afin que le visiteur sache ou il se trouve.
Je suppose qu’il faut jouer avec le code Spip du menu et les css mes je n’en sais pas plus. Pouvez vous me dire comment faire ?
P.S : Merci pour ce menu déroulant. Le l’utilise déjà pour deux de mes sites. Les premières modifications n’ont pas été faciles mais ca commence à venir :)
Répondre à ce message
Bravo et merci pour cet excellent plugin.
La boucle est aussi simple que souple ; je l’ai modifiée pour contrôler l’affichage des items en fonction de mots-clés affectés aux rubriques (rendre des rubriques invisibles par exemple) et tout marche à merveille.
On a aussi des possibilités assez grandes pour modifier les styles apparemment sans que ça casse.
Répondre à ce message
Je souhaite rajouter un ou plusieurs liens vers d’autres pages html ne faisant pas partie de spip, comment je procède pour les inclurent dans ce fabuleux menu ??
Exemple, je souhaite rajouter un lien vers www.monsitespip.com/forum
Merci et bonne continuation
Répondre à ce message
Bonjour,
Merci au père noël pour ce menu qui fonctionne parfaitement, sauf que...
... avec 4 niveaux de sous rubriques, les dernières ne sont pas faciles à « attraper », savez vous si il est possible de laisser le menu ouvert (déplié) même si la souris est en dehors de la case. Je n’ai pas trouvé dans le java script un « onmouseover » ou un « onmouseout »...
Merci
Répondre à ce message
Bonjour
Le plugin fonctionne plutôt bien pour un menu horizontal effectivement. Par contre pour un menu vertical, auriez vous une solution svp ?
Merci pour votre réponse :-)
Répondre à ce message
salut,
j’ai plusieurs problèmes avec ce menu, tous sous firefox et safari, pas de problèmes avec ie.
j’ai mis le inclure menu_deroulant dans une div, suivie d’une autre div qui affiche des images de différentes tailles (donc height : auto ;). Les deux font partie d’une une autre div (donc height : auto ; aussi) :
css associé :
voici le css du menu :
Premier problème :
le menu déborde de la div menu en bas, ce qui entraine un espace d’une dizaine de pixels au dessus (couleure verte). En plus, la balise menu_box semble s’agrandir en proportion et créé elle aussi un espace d’une dizaine de pixels. La div menu_bottom ne semble pas être affectée.
en retirant le inclure, les div retrouvent leur taille normale
Deuxième problème :
Un décalage a gauche du menu en entier d’au moins 50 pixels, le même décalage à l’intérieur des menus déroulés.
regardez plutot par vous même (essayez avec ie pour voir le résultat demandé)
j’ai coloré les div pour bien se rendre compte du problème
site test
Si quelqu’un a une réponse à ce problème, dite le moi, merci d’avance.
je me répons a moi même,
j’avais trop modifié le css, du coup il y avait des incohérences qui créaient les erreurs.
tout fonctionne bien maintenant
Répondre à ce message
Salut,
J’ai installé et modifier les ccs du menu. Ca fonctionne parfaitement sur Firefox et IE 7. Mais sur IE 6, le menu ne se déroule pas. Ennuyeux pour un menu déroulant. Cher développeur, peux tu me dire si ce menu est censé se dérouler avec IE6 ou si je dois envisager un menu alternatif pour cette version d’IE (qui est pourri, soit dis en passant).
Onyrodine
Répondre à ce message
Je viens de l’installer sur une 1.9.2, ça marche bien tant qu’on ne depasse pas trois sous-niveau. Après tous les sous menus se déroulent en même temps... Est-ce que je suis le seul ?
Je me répond à moi-même...
Il faut modifier menu_deroulant.css et rajouter :
#nav li:hover ul ul ul ul ul,
#nav li.sfhover ul ul ul ul ul
#nav li li li li li:hover ul,
#nav li li li li li.sfhover ul,
Dans les sections correspondantes et mettre d’autant plus de ul et de li qu’on veut descendre dans les sous-menus.
Il suffit de mettre dans la partie #nav li ul ul :
#nav li ul ul
margin : -1.75em 0 0 13em ;
—
Kinguantoin
Il suffit de mettre dans la partie #nav li ul ul :
—
Kinguantoin
Et de virer :
float: left;dans#nav li—
Kingantoin
Comment faire pour que le premier sous-niveau soit à droite et pas en-dessous ?
Merci d’avance,
J-F Dupal
ah oui, si vous avez la réponse, JE SUIS PRENEUR !!
Après ça, mon menu sera parfait...jusqu’à la prochaine amélioration...
Répondre à ce message
Hello,
Comment y ajouter les articles de la rubrique de premier niveau, j’ai bien tenté ceci :
Mais il me superpose les articles et les rubriques ! Un problème de classe de style je supose, mais j’ai déjà tenté pas mal de choses sans résultat !
Une idée, un conseil, je suis preneur !
Merci
Paul
Voila, une petite modif qui permet d’afficher les articles des rubriques ainsi que ceux des sous rubriques. Visible sur www.cyberlcs.com
---------------
/B_sous_rubriques>
Avec les balises code, c’est mieux !
J’ai mis ce code dans inc-menu-déroulant.html et rien ne se passe...
J’ai vidé le cache, redemaré apache effacé mes trace dans fire fox et toujours rien...
Quelqu’un aurai une idée ???????????
Même problème pour moi...
Désolé d’être débutant, mais c’est vrai que très très souvent, les auteurs ne précisent pas où placer les balises qu’ils proposent... Cette petite précision serait pourtant EXTREMEMENT utile aux gens comme moi (comme nous, apparemment) qui cherchent, cherchent, cherchent...et trouvent parfois, mais au prix de longues heures de tâtonnement...
...et donc, oui, en tâtonnatn, j’ai trouvé : dans ton éditeur de squelettes, inc-menu, tu rajoutes ces balises, après avoir viré le « insert inc-menu déroulant ».
Et ça marche !!
Merci pour cette balise magique, c’est très chouette !!
Répondre à ce message
Bonjour,
Merci pour ce menu très simple d’utilisation
Je sèche lamentablement sur une bêtise : je voudrais juste centrer le menu dans ma page (un bloc) mais je n’y arrive pas. Merci de vos réponses !
Répondre à ce message
Bonsoir à tous !
merci tout d’abord pour ce plugin très pratique !
une petite demande :
est-il possible de ne faire apparaitre qu’une partie de l’arborescence, sans partir qui plus est de la racine ?
je m’explique
j’ai déjà un menu spécial pour ma page sommaire. je clique sur une image qui me conduit à une des rubriques. là je voudrais mettre un menu horizontale qui comprendrait les sous rubriques et leurs éventuelles sous-sous rubriques.
sauriez-vous m’indiquer comment m’y prendre ?
je vous en remercie d’avance !
Je me reponds à moi-même !
Il suffisait juste de modifier la boucle et d’indiquer un
{id_parent=la rubrique dont on veut les sous rubrique}à la place de{racine}dans son inc-menu_deroulant.htlmmerci pour le plug, très pratique, vraiment !
Répondre à ce message
Bonjour,
Sous spip 1.9.2 squelettes Alternatives le menu déroulant « passe » dessous l’image du haut. Ben, j’aimerai bien pouvoir la faire passer au-dessus.
Une idée ?
Merci
MichelD
Bonjour, j’ai eu le même soucis que toi.
J’ai eu la réponse dans la liste.
Dans les paramètres du code de « menu_deroulant.css »,
il te faut rajouter dans le code suivant après, en fin de liste des paramètres pris entre
{ et }:Insèrer un z-index élevé : ex : z-index=50
Je te suggère de le mettre à 100 pour voir, puis si c’est ok de descendre un peu.
J’espère t’avoir un peu aidé.
Bonjour.
J’ai fait tout comme tu as dit, car j’ai le même problème.
Seulement, ça ne change absolument rien du tout.
J’ai essayé « z-index=50 » « z-index=50 ; » « z-index:50 » « z-index:50 ; »....
Rien. Jamais. C’est rageant, car je touche presque au but de mon menu !!!!
http://nicolas.zan.free.fr
Je vous remercie de toute aide !
Eh bien, je me réponds tout seul : voici la solution, dans menu-deroulant.css :
#nav li ul ul
margin : 0em 0 0 8em ;
z-index:20 ;
Le z-index fait apparaître au dessus, et les valeurs de margin gèrent les positions des blocs.
J’ai trouvé ça en tâtonnant, je le poste au cas où qqn galère comme moi pendant plusieurs jours !!!
NicoZ
Répondre à ce message
Quelqu’un a-t’il une idée de comment on peut organiser les rubriques affichées dans le menu, autrement que dans un ordre alphabétique ?
Merci d’avance.
Comme dans toute boucle spip, en numérotant les rubriques. Il faut ajouter devant le titre des rubriques un numéro suivi d’un point ET d’un espace :
1. Ma rubrique qui doit apparaître en 1
2. Ma deuxième
etc...
Tu leurs met des chiffres comme cela par exemple :
01. rubrique ploum
02. rubrique muche
puis dans tes squelettes :
rubrique|supprimer_numero
Répondre à ce message
Bonjour,
Après mon message précédent, je viens de tester avec IE7 et c’est la catastrophe, le site trois colonne se retrouve avec la colonne centrale complètement descendue.
Puis-je avoir de l’aide, merci.
Répondre à ce message
Bonjour,
Voilà, je cherchais une solution pour un menu déroulant, mais vertical, j’en ai essayé je ne sais plus combien, mais je suis si mauvais en css que je n’ai pas réussi.
Tellement décidé à avoir ce type de menu que j’ai décidé d’installer ce plugin en me disant « je dois pouvoir le bidouiller ».
J’ai été surpris de n’avoir pas eu à le faire, il m’a suffit de l’installer à la place de l’ancien menu, dans un cadre, et il fonctionne à merveille.
Je n’ai rencontré qu’un problème, quand on développe le nombre de rubriques, si il y a cadre dessous, il n’est pas poussé avec le développement des menus, j’ai été obligé de rajouter des
<br><br>c’est pas trés propre.Quelqu’un a un conseil ?
En tout cas, merci pour ce plugin, il est génial.
Répondre à ce message
Bonjour,
mon menu ne fonctionne pas sous IE 7 :
- parfois il se déroule mais reste déroulé
- parfois il ne se déroule carrément pas...
Gênant dans ls deux cas.
Quelqu’un a-t-il une explication voire une solution à proposer ???
Merci
Bonjour
j’ai aussi un problème avec le menu déroulant et Internet Explorer. Je suis en spip 1.9.2 donc a priori, si j’ai bien lu les autres commentaires, je n’ai pas besoin d’ajouter JQuery car il est intégré dans le noyau de spip. Aucun probleme autrement sous Safari.
Le site : www.lairederien.net, le menu déroulant n’est pas installé sur la page d’accueil, mais sur les pages rubrique et article.
Une idée ? une piste à creuser.
Je vous remercie et bravo pour ce plugin, car quand il marche, c’est vraiment trop fort ;)
Amicalement
Christophe
Désolé, j’ai trouvé la solution... et comme je l’envisageais, il s’agissait d’un truc tout con. Dans la feuille CSS du menu déroulant, j’avais introduit des commentaires sous la forme
En passant d’IE6 à IE7, j’ai eu ce bug. Les parties développées du menu restaient déroulées.
Bon, il faut rajouter le morceau de JS dispo sur le site htmldog.
Dans « menu_deroulant.js », à la suite.
En espérant que cela aide.
super ! ca résouts le soucis :)
merci
Répondre à ce message
salut, et grand bravo pour ton menu
je suis tout nouveau avec le CMS SPIP et j’éssais depuis 1h d’intégrer ce menu juste après la bannierre d’un css que j’ai télécharger sur le web. Aucun menu ne s’affiche, pourtant j’ai suivi à la lettre les étapes nécessaire pour. j’ai aussi éssayé les memes étapes sur la page sommaire du site spip que j’ai installé en local mais le menu s’affiche tout en vertical.
s’il vous plait aidez- moi je ne pige rien à ce probleme.
Merci d’avance
pour le message du 1er decembre, j’ai oublié de mentionner que j’utilise la version 1.9.2 de spip.
merci
Peux-tu donner une url ou voir ton squelette ?
Répondre à ce message
Bonjour,
bravo pour ce menu,
je le teste en ce moment en local sur un spip 1.9.2c, çà marche bien sauf que je n’ai pas la petite flêche en face des sous rubriques....???
voici le code que j’ai copier plus bas
Que puis-je faire ?
merci Jmarco
Je me réponds...
il fallait changer la class=« daddy » de place, et la mettre juste après le href=« #URL_RUBRIQUE »,
ce qui donne :
çà marche mais j’aimerais bien comprendre pourquoi, et aussi pourquoi il y a le « daddy2 » au niveau des articles ??
amicalement, Jmaco
Bonjour,
voici le résultat en ligne :
http://www.le-clapotis.net/sculpteurs3/
j’ai placé ce menu uniquement sur la page sommaire de mon site.
Amicalement, jmarco.
Répondre à ce message
Bonjour,
Je souhaite créer un nouveau site en Spip pour mon club de plongée. Mon hébergeur ne me permettant normalement pas le php, je l’héberge pour l’instant chez free dans mes pages perso. J’ai créé, un peu à la va-vite je l’accorde des rubriques, sous rubriques et quelques articles. J’aimerais bien un menu horizontal, et j’ai alors trouvé la page consacrée à « menu déroulant »
j’ai décompressé le .zip, copié les fichiers grâce à Filezilla dans un dossier « plugins » que j’avais créé. Ces opérations se sont bien passées puisque dans le menu « configuration\Gestion des plugins » je peux activer le plugin « menu déroulant ». Je n’ai pas de squelette personnalisé, donc si j’ai bien compris mon spip appelle le squelette contenu dans « /dist ». J’ai néanmoins déposé une copie dans le dossier « /squelettes » des fichiers « inc-menu-deroulant.html » et « menu_deroulant.css ».
Hélas, pas de menu déroulant
Quelqu’un sait-il pourquoi ?
Je précise que mon site se trouve là : http://phil.kdo.free.fr
Merci de votre aide
Philippe
Ben oui, il manque une opération : relis ce passage :
« Insérer la noisette de menu déroulant où bon vous semble dans votre squelette (généralement en haut de page, en dessous du bandeau) par un inclure :
»
Répondre à ce message
Toute l’arborescence du menu est imprimée verticalement... Il y a-t-il un moyen de corriger cela ?
Sinon, un très bon plugin même si je me suis un peu arraché les cheveux avec le CSS...
:-)
Répondre à ce message
Bonjour
j ai installé le plugin, sur une v spip 1.9.2b
ça fonctionne sous IE 7 mais erreurs sous IE 6 !!!!
sous IE6 je n ai pas le surlignement au survol ni le developpement de la rubrique au survol toujours !
j avoue ne pas bien comprendre . de plus je ne suis pas à l aise avec les CSS , et debute avec spip
j ai recopié les fichiers dans des repertoires du squelette
car le « plugin » ne s affichait pas dans l interface de spip du menu configuration/plugin
l important : c’est que ça marche
ai lu les articles postés sur ce forum - et comme je suis en v 19.2b donc sup a 1.9.1 je n ai pas besoin d installer un module jquery
suis allee voir si il existait bien dans dist/javascript : oui, il y est en v 1.1
dois je rajouter qqchose ?
comment faire pour avertir un utilisateur que sa version est ancienne et qu une meilleure visu sera avec un upgrade de ce dernier ?
MERCI d avance !
MERCI pour les contributions et les aides !!
mp
Répondre à ce message
Bonjour,
Ce plugin est vraiment très pratique et très bien pensé. Il est vraiment quasiment parfait pour les non developpeurs (graphiste bidouilleur) comme moi...
J’aurais néamoins quelques remarques et questions, si des spipeurs pouvaient me répondre ce serait fantastique.
1 : J’aurais voulu savoir s’il était possible d’afficher des articles également (un peu comme dans l’exemple de dhml dog, ou les rubriques cotoient les liens vers les pages d’articles).
2 : quelqu’un a t’il réalisé ce menu en vertical ?
J’ai vu que cela était réalisable sur le site htmldog : http://www.htmldog.com/articles/suckerfish/dropdowns/example/vertical.html
3 : Un des menus de cssplay est vraiment très bien.
http://www.cssplay.co.uk/menus/flyout_4level.html
D’après vous est ce possible de réaliser en spip un tel menu déroulant ?
Emmanuel
bidouilleur spip
Tu peux essayer de voir les autres menus proposés sur spip-contrib : http://www.spip-contrib.net/-Menus- pour trouver des solutions de menus verticaux. Attention, ce ne sont pas des plugins, et la mise en place est sensiblement plus technique.
Répondre à ce message
IE 6, Firefox 2 sont parfaits... mais Opéra 9.1 affiche les items en une colonne d’une largeur de 1 lettre.
Je vous raconte pas la gueule du menu !
C’est le
qu’il aime pas, dans :
Du coup, j’ai pas trop envie de mettre en ligne ma page.
Des idées ?
Arnaud
Répondre à ce message
Super plugin, est-ce qu’on peut le transformer en menu vertical facilement ?
merci d’avance
Répondre à ce message
Bonjour,
Le plugin fonctionne bien cependant le menu des sous rubriques se cache derriere les autres elements de ma page dans le sommaire
y a t il une astuce ??
merci de votre réponse
Répondre à ce message
Bonjour et félicitations, je recherchais ce plugin avec impatience.
J’ai des rubriques avec des articles et des rubriques sans articles composées de sous-rubriques avec des articles.
Je souhaite afficher toutes les rubriques contenant le mot clé “menu-entete” avec comme sous-menu : les articles dans le premier cas et les sous-rubriques sans les articles associés dans le second.
voici le code utilisé :
J’ai inséré la boucle “article” dans la boucle "sous-rubrique" au niveau du Code HTML alternatif entre /B_n et //B_n.
Malgré celà, les titres des articles apparaissent quand-même pour les rubriques ayant des sous-rubriques.
Une idée ???
Par avance, merci et bonne continuation.
Répondre à ce message
Bonjour,
quelqu’un(e) sait où régler le « délai » de disparition des sous-menus ? j’ai cherché dans les fichiers javascripts du plugin mais je n’ai rien trouvé, je ne maîtrise pas assez le js pour ça...
merci par avance et félicitations pour ce plugin qui m’a fait gagné beaucoup de temps
Nicolas
Répondre à ce message
Bonjour,
super plugin et encore bravo aux auteurs.
Je l’ai mis en oeuvre sur mon intranet en test. Fonctionne impécable avec Firefox et safari, par contre avec IE6 j’ai une erreur qui dit : « jQuery indéfini ».
N’étant pas un spécialiste, et après recherche sur le net, je reste sans comprendre cette erreur.
Si vous avez une piste je suis fort interréssé.
Merci d’avance.
Je me réponds, je cherchais compliqué ... En installant le plugin jQuery je n’ai plus le problème avec IE6.
Désolé pour le bruit.
Répondre à ce message
Retour après installation
J’ai installé ce menu déroulant horizontal. Il faut bien plus de 5 minutes (et je ne compte pas les téléchargements). Voici toutes les actions que j’ai faites pour qu’il fonctionne.
1- installer le plugin -jQuery (inutile avec Spip1.9.2)
2- ajouter la balise #INSERT_HEAD dans les en-têtes de pages (heureusement qu’avec les noisettes, je ne l’ai à faire qu’une seule fois !)
3- installer le plugin menu-deroulant
4- tester en appelant par http://[www.domaine.suf]/spip.php ?page=menuder_sommaire_demo
5- appeler la noisette du menu déroulant dans les squelettes où elle est souhaitée (même remarque que ci-dessus : une seule noisette à modifier pou moi).
6- tester cette insertion en visitant le site.
Et je n’ai pas modifié la présentation (couleurs) pour l’instant.
La balise #INSERT_HEAD fonctionne parfaitement en même temps qu’un appel d’une applet js (ouf !).
Il est indispensable de se réserver, à droite un espace pour l’affichage des sous-rubriques. J’ai résolu ce problème en affichant la partie centrale de ma page après la colonne de droite.
Pour ne pas avoir le b... bazar dans le menu, il vaut mieux des titres plutôt courts (j’ai dû en modifier quelques-uns).
Conclusion : avec un peu d’attention (et surtout de calme), ça fonctionne au premier coup ! Donc, bravo au(x) concepteur(s)/trice(s) et au(x) vulgarisateur(s)/trice(s).
Bonjour,
Quelque peu débutant sur spip, j’ai installé les deux plugins nécessaires au fonctionnement du menu déroulant horizontal. Le site tourne sur spip 1.9.1, avec le squelette BLIP. La balise #INSERT_HEAD est présente mais je n’arrive pas à comprendre où je dois installé la ligne de commande , doit-on placer cette ligne de commande dans un fichier particulier et lequel ? La page démo s’affiche mais je n’ai plus de feuille de style valide, au secours !!!
merci d’avance pour votre aide...
Répondre à ce message
bon ok ca fait un moment que je n’ai pas spipé ...
J’avais bien testé 2 ou 3 plugins sur la 1.9
Mais la je suis perdu y a une 1.9.2 introuvable, du coup j’ai fait avec ma 1.9 et j’ai installé ce plugin fort sympathique ... J’ai fait avec le plugin supplémentaire a installé
bon ok je suis pas pro des css, mais pourquoi le css qui est dans le dossier plugin y veut pas trouver le header.inc.html ou y a le super menu déroulant ...
La je calle
pouvez vous m’aider ?
j’ai trouvé tout seul :-)
le temps de se remettre dedans
merci pour ce beau plugin
Répondre à ce message
Super le menu
Seul bemol, il ne marche pas sous IE6, probleme de css trop compliqué
Je crois que ca « li.sfhover » il ne comprend pas
Si quelqu’un pouvait éclairer ma lanterne ce serrai vraiment génial :p
Répondre à ce message
Chouette ; j’ai plus qu’a fire la modif affichage en fonction d’un mot clef.
Répondre à ce message
Simple et efficace !!
Effectivement installé en mois de 5 minutes, sur une 1.9.1.
J’ai du tout de meme effacer le cache.
J’aurai 2 suggestions à rajouter dans la wishlist :
- Ajouter la balise #EXPOSER qui permet de marquer la rubrique dans laquelle on se trouve.
- Ajouter un parametre permettant de limiter le menu a une rubrique (et donc automatiquement limité aux sous-rubriques et articles contenus dans cette rubrique) C’est surement beaucoup plus compliqué a faire, mais cela serait terriblement efficace.
C’est une question qui est importante pour moi aussi ; je suis en train de construire un site ou seulement une partie des articles ont des traductions. C’est pourquoi je ne veux afficher que la section principale (rubrique 1 dans mon cas) avec les articles originaux.
Ce que j’ai fait pour réaliser cela : dans inc-menu-deroulant.html (boucle rubriques) j’ai simplement changé racine par id_parent=1 et cela semble marcher.
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 :
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.
Suivre les commentaires :
|
