slidedown<\/code> au survol, un fadeout<\/code> lorsqu’on quitte le sous-menu. Un petit effet gadget a \u00e9t\u00e9 ajout\u00e9 sur les liens des sous-menus au survol. Je vous laisse prendre connaissance de cela :
\nPlugin jQuery – DropDown Menu<\/a><\/p>\n\u00c9dition : le plugin dont il est question a subit une refonte structurelle<\/a>, la CSS a \u00e9t\u00e9 externalis\u00e9e, le comportement et la compatibilit\u00e9 am\u00e9lior\u00e9s. Les informations qui suivent ne sont donc plus vraiment d’actualit\u00e9. Cet article est conserv\u00e9 pour les archives \ud83d\ude09<\/p>\nLe code de base<\/h2>\n
Il vous faudra simplement un menu non-ordonn\u00e9 dans un autre menu non-ordonn\u00e9.
\nExemple :<\/p>\n
<div id=\"dropdown\">\r\n\t<ul>\r\n\t\t<li><a href=\"#accueil\">Accueil<\/a><\/li>\r\n\t\t<li><a href=\"#rea\">Nos services<\/a>\r\n\t\t\t<ul>\r\n\t\t\t\t<li><a href=\"#print\">Print<\/a><\/li>\r\n\t\t\t\t<li><a href=\"#web\">Web<\/a><\/li>\r\n\t\t\t\t<li><a href=\"#marketing\">Marketing<\/a><\/li>\r\n\t\t\t\t<li><a href=\"#ref\">R\u00e9f\u00e9rencement<\/a><\/li>\r\n\t\t\t\t<li><a href=\"#access\">Accessibilit\u00e9<\/a><\/li>\r\n\t\t\t<\/ul>\r\n\t\t<\/li>\r\n\t\t<li><a href=\"#comp\">À propos<\/a>\r\n\t\t\t<ul>\r\n\t\t\t\t<li><a href=\"#who\">Qui sommes nous ?<\/a><\/li>\r\n\t\t\t\t<li><a href=\"#what\">Nos comp\u00e9tences<\/a><\/li>\r\n\t\t\t\t<li><a href=\"#ref\">Nos r\u00e9f\u00e9rences<\/a><\/li>\r\n\t\t\t<\/ul>\r\n\t\t<\/li>\r\n\t\t<li><a href=\"#contact\">Contact<\/a><\/li>\r\n\t<\/ul>\r\n<\/div><\/code><\/pre>\nL’important c’est d’avoir de quoi cibler votre menu pr\u00e9cis\u00e9ment gr\u00e2ce \u00e0 un \u00e9l\u00e9ment de type block conteneur (par l’utilisation d’une classe ou d’un identifiant soit directement sur l’\u00e9l\u00e9ment soit sur un parent assez proche).<\/p>\n
![\"\"](\"\/blog\/wp-content\/uploads\/2010\/08\/article-juiz.jpg\" "\\"Plugin")
<\/p>\n
Mise en place et personnalisation<\/h2>\n
Je ne vais pas vous redonner le contenu de la page du plugin, je vous laisse en prendre connaissance :
\nPlugin jQuery – DropDown Menu – Utilisation<\/a><\/p>\nLa personnalisation passe principalement par du CSS \u00e9crit gr\u00e2ce \u00e0 jQuery. Une multitude de variables sont donc disponibles et modifiables. J’admets que ce n’est pas forc\u00e9ment le plus ais\u00e9 pour une personne qui s’y connait en CSS, car en plus des modifications \u00e0 effectuer il faut s’habituer aux noms des variables (rendues les plus explicites possible) ; mais ce plugin s’adresse justement \u00e0 un public plut\u00f4t large, et doit comprendre les novices en ce langage de style.<\/p>\n
Am\u00e9liorations<\/h2>\n
Pour toute suggestion d’am\u00e9lioration ou rapport de bogue, n’h\u00e9sitez pas \u00e0 me contacter ici ou via le formulaire de contact du blog, des plugins, du book, etc. (au choix, pas partout en m\u00eame temps :p )<\/p>\n
Merci, et amusez-vous bien !<\/p>\n
Liens utiles :
\n– Plugin jQuery – DropDown Menu<\/a>
\n– Les Plugins jQuery sur CreativeJuiz<\/a><\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Apr\u00e8s m’\u00eatre amus\u00e9 longuement \u00e0 la visite de nombreux sites habill\u00e9s de jolis menus d\u00e9roulant, il m’a pris l’envie de r\u00e9aliser un plugin facile d’installation pour les utilisateurs de jQuery. Sur un design l\u00e9ger et des fichiers qui le sont tout autant, celui-ci reste grandement personnalisable.<\/p>\n","protected":false},"author":4,"featured_media":298,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_bluesky_dont_syndicate":"","_bluesky_syndication_accounts":"","_bluesky_syndication_text":"","footnotes":""},"categories":[610,50],"tags":[158,159,52,157,51],"coauthors":[597],"class_list":["post-444","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-javascript","category-ressources-telechargements","tag-deroulant","tag-dropdown","tag-jquery","tag-menu","tag-plugin"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/posts\/444","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/comments?post=444"}],"version-history":[{"count":0,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/posts\/444\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/media\/298"}],"wp:attachment":[{"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/media?parent=444"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/categories?post=444"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/tags?post=444"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/www.creativejuiz.fr\/blog\/wp-json\/wp\/v2\/coauthors?post=444"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}