1. Forum CMS Made Simple FR
  2. Général
  3. Modules, Tags
Sujet fermé
Note de ce sujet :
  • Moyenne : 0 (0 vote(s))
  • 1
  • 2
  • 3
  • 4
  • 5

Affichage linéaire
[RESOLU] Créer menu DropDown*
FlorentCMSMS
Unregistered
 
#1

22/07/2010, 14:55:42
Citation :#~~~~~ NE PAS SUPPRIMER CE BLOC ~~~~~
#~ Version du CMS: 1.6.7
#~ Nom de l'hébergeur : OHV DEDIE PLESK
#~ Informations Système :
#~ ~ ----------------------------------------------
#~ #~ Cms Version: 1.6.7
#~ #~ Installed Modules:
#~ #~ CMSMailer: 1.73.14
#~ #~ FileManager: 1.0.1
#~ #~ MenuManager: 1.6.2
#~ #~ ModuleManager: 1.3.1
#~ #~ News: 2.10.3
#~ #~ nuSOAP: 1.0.1
#~ #~ Printing: 1.0.3
#~ #~ Search: 1.6.1
#~ #~ ThemeManager: 1.1.1
#~ #~ TinyMCE: 2.7.0
#~ #~ Captcha: 0.4.1
#~ #~ CGExtensions: 1.19
#~ #~ Gallery: 1.3
#~ #~ Twitter: 0.0.7
#~ #~ AjaxMadeSimple: 0.1.6
#~ #~ Polls: 0.2.0
#~ #~ SiteMapMadeSimple: 1.2.1
#~ #~ FrontEndUsers: 1.9.3
#~ #~ Config Information:
#~ #~ php_memory_limit:
#~ #~ process_whole_template: false
#~ #~ max_upload_size: 20000000
#~ #~ default_upload_permission: 664
#~ #~ assume_mod_rewrite: true
#~ #~ page_extension: .htm
#~ #~ internal_pretty_urls: false
#~ #~ use_hierarchy: true
#~ #~ Php Information:
#~ #~ phpversion: 5.1.6
#~ #~ md5_function: On (Vrai)
#~ #~ gd_version: 2
#~ #~ tempnam_function: On (Vrai)
#~ #~ magic_quotes_runtime: Off (Faux)
#~ #~ memory_limit: 32M
#~ #~ max_execution_time: 300
#~ #~ safe_mode: Off (Faux)
#~ #~ session_save_path: /var/lib/php/session (0770)
#~ #~ session_use_cookies: On (Vrai)
#~ #~ Server Information:
#~ #~ Server Api: cgi-fcgi
#~ #~ Server Db Type: MySQL (mysql)
#~ #~ Server Db Version: 5.0.45
#~ #~ ----------------------------------------------
#~~~~~ NE PAS SUPPRIMER CE BLOC ~~~~~
Bonjour à tous,

J'ouvre un topic dans la continuité de celui ci : http://www.cmsmadesimple.fr/forum/viewtopic.php?id=2736
Je pensais que mon problème était résolu, mais en ajoutant plusieurs sous menus plus rien n'allait ^^.

J'ai donc modifié un peu le code pour obtenir ceci :


Code :
{if $count > 0}
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="</li>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li>" times=$node->prevdepth-$node->depth}
{/if}
{if $node->type == 'sectionheader' and $node->depth == 1}
<li><a href="#">{$node->menutext}</a>
<div class="sub">
{elseif $node->type == 'sectionheader' and $node->depth != 1}
<ul><li><h2><a href="#">{$node->menutext}</a></h2></li>
{else}
<li><a href="{$node->url}">{$node->menutext}</a>
{/if}
{/foreach}
{repeat string="</div>" times=$node->depth-1}
{/if}
Le résultat souhaité approcherait de cela : http://www.sohtanaka.com/web-design/mega...ss-jquery/ (je sais, j'aurais du coder main Confused )

De mon coté un seule différence, ma div ".sub" a une taille et une position bien définie. Cela ressemble à ce que l'on peut voir sur cdiscount, le site de l'OL, le site du PSG par exemple.

Pour ce qui est du code, en version statique le code ressemble à ceci :

Code :
<ul id="topnav">
/* BOUCLE */
        <li>
            <a href="#">Entête lv 1</a> /*présent dans ma barre de menu */
            <div class="sub">
                <ul>
                    <li><h2><a href="#">Entête lv 1.1</a></h2></li> /*une colone dans ma div .sub */
                    <li><a href="#">Navigation Link</a></li> /* lien 1.1.1 */
                    <li><a href="#">Navigation Link</a></li> /* lien 1.1.2 */
                    <li><a href="#">Navigation Link</a></li> /* lien 1.1.3 */
                    <li><a href="#">Navigation Link</a></li> /* lien 1.1.4 */
                    <li><a href="#">Navigation Link</a></li> /* lien 1.1.5 */
                    <li><a href="#">Navigation Link</a></li> /* lien 1.1.6 */
                    <li><a href="#">Navigation Link</a></li> /* etc. etc.*/
                </ul>
                <ul>
                    <li><h2><a href="#">Entête 1.2</a></h2></li>
                    <li><a href="#">Navigation Link</a></li> /* lien 1.2.1 */
                    <li><a href="#">Navigation Link</a></li> /* etc */
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                </ul>
                <ul>
                    <li><h2><a href="#">Entête 1.3</a></h2></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>  /*lien 1.3.1*/
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                </ul>
            </div>
        </li>
        <li>
/* Les autre blocs ne sont qu'une répétition du code au dessus, seul les variables changent */
            <a href="#" >Entête 2</a>
            <div class="sub">
                <ul>
                    <li><h2><a href="#">2.1</a></h2></li>
                    <li><a href="#">2.1.1</a></li>
                    <li><a href="#">2.1.2</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                </ul>
                <ul>
                    <li><h2><a href="#">iPad</a></h2></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                </ul>
                <ul>
                    <li><h2><a href="#">iPhone</a></h2></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                </ul>  
            </div>
        </li>
        <li>
            <a href="#">Saison</a>
                        <div class="sub">
                <ul>
                    <li><h2><a href="#">Desktop</a></h2></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                </ul>
                <ul>
                    <li><h2><a href="#">Laptop</a></h2></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                </ul>
                <ul>
                    <li><h2><a href="#">Accessories</a></h2></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                </ul>
            </div>  
        </li>
        <li>
            <a href="#" >Evènements</a>
                        <div class="sub">
                <ul>
                    <li><h2><a href="#">Desktop</a></h2></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                </ul>
                <ul>
                    <li><h2><a href="#">Laptop</a></h2></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                </ul>
                <ul>
                    <li><h2><a href="#">Accessories</a></h2></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                    <li><a href="#">Navigation Link</a></li>
                </ul>
            </div>
        </li>
    </ul>
Je viens vous demande un petit coup de main, même en ayant passé quelques heures la dessus, je n'arrive pas à résoudre mon problème Confused.

En vous remerciant par avance Smile

Passez une bonne aprem'
« Sujet précédent | Sujet suivant »
Sujet fermé


Messages dans ce sujet

Atteindre :


Utilisateur(s) parcourant ce sujet : 1 visiteur(s)
  1. Forum CMS Made Simple FR
  2. Général
  3. Modules, Tags