Sujet fermé
Note de ce sujet :
  • Moyenne : 0 (0 vote(s))
  • 1
  • 2
  • 3
  • 4
  • 5

Problème Menu déroulant [Résolu]
#1

Bonsoir à l'ensemble de la communauté.

Je suis novice en php smarty mais j'utilise actuellement cms made qui est fort pratique et simple d'utilisation.

Mon souci et ce n'est pas la première fois, vient de la conception des menus. Je n'arrive pas à comprendre le fonctionnement.

Mon problème concerne le menu déroulant avec enfant. Un exemple j'ai actuellement préparé un menu déroulant en css javascript:

Voici mon code :


<ul class="menu-nav">

<li id="current"><a href="#"><strong>Accueil</strong></a></li>
<li><a href="#"<strong>Services</strong></a>

*/partie enfant/*

<div class="ulwrapper">

<ul>
<li><a href="#"><strong>Test 1</strong></a></li>
<li><a href="#"><strong>test 2</strong></a></li>
<li><a href="#"><strong>Test 3</strong></a></li>
<li><a href="#"><strong>Test 4</strong></a></li>

</ul>

</div></li>

/* fin partie enfant*/


<li class="top item54"><a href="#"><strong>booking</strong></a></li>
<li class="top item58"><a href="#"><strong>Contact</strong></a></li></ul>




Peut être avez-vous des tuyaux à me donner ou des tutos afin de comprendre car j'ai beau lire le wiki cms je n'y arrive tjrs pas.

Merci et bonne soirée
#2

Bonjour,

Ton code n'est pas suffisant pour te donner une réponse précise.
Pour tes 4 parents, tu as :
la classe current,
ou pas de classe
ou une classe top avec n°item.
Que veux-tu exactement comme classes ?
Et les enfants : pas de classe même s'ils sont current ?
N'y-a-t-il que 2 niveaux ?
Merci de nous donner un code complet avec les différents cas possibles.

En attendant, voici une possibilité
Code :
{strip}
{if $count > 0}
<ul class="menu-nav">
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="<div class='ulwrapper'><ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</div></li>
{elseif $node->index > 0}</li>
{/if}
{if $node->current == true}
<li class="current item{$node->id}"><a href="{$node->url}" class="currentpage" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{elseif $node->parent == true && $node->depth == 1}
<li class="activeparent item{$node->id}"> <a href="{$node->url}" class="activeparent"{if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{elseif $node->type == 'sectionheader'}
<li class="sectionheader}">{$node->menutext}
{elseif $node->type == 'separator'}
<li style="list-style-type: none;"> <hr class="separator" />
{else}
<li class="item{$node->id}"><a href="{$node->url}"{if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{/if}
{/foreach}
{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}
{/strip}
#3

Bonjour,

Tout d'abord merci pour ta réponse, effectivement il y a une classe top parent item et une classe current sur les parent et effectivement je n'ai que deux niveaux, ton code ma solutionné les trois quart de mon problème, c'est juste la classe top parent item, mais je ne sais pas ou la déclaré dans le code que tu m'a fourni. Encore merci pour ton aide.


<ul class="menu-nav">

<li id="current"><a href="#"><strong>Accueil</strong></a></li>
<li class="top parent item"><a href="#"<strong>Services</strong></a>

<div class="ulwrapper">

<ul>
<li><a href="#"><strong>Room packages</strong></a></li>
<li><a href="#"><strong>room gallery</strong></a></li>
<li><a href="#"><strong>hot offers</strong></a></li>
<li><a href="#"><strong>standards</strong></a></li></ul>

</div></li>

<li class="top item"><a href="#"><strong>booking</strong></a></li>
<li class="top item"><a href="#"><strong>offers</strong></a></li>
<li class="top item"><a href="#"><strong>Contacts</strong></a></li></ul>
#4

Pas besoin du n° item ?
Non répondu : et si on est sur la page 2.1 faut-il ceci ?
Code :
<ul class="menu-nav">            
    <li class="top item"><a href="#"><strong>Accueil</strong></a></li>
    <li class="top parent item"><a href="#"<strong>Services</strong></a>
    */partie enfant/*
        <div class="ulwrapper">            
            <ul>
                <li id="current"><a href="#"><strong>Test 1</strong></a></li>
                <li><a href="#"><strong>test 2</strong></a></li>
...
#5

Bonjour,

Non du coup pas besoin de numéro item et pas besoin de la id current pour le 2.1.

Encore merci
#6

Je te conseille de remplacer id="current" par class="current", surtout si tu as un second menu.

Code :
{strip}
{if $count > 0}
<ul class="menu-nav">
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="<div class='ulwrapper'><ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</div></li>
{elseif $node->index > 0}</li>
{/if}
{if $node->current == true && $node->depth == 1}
<li class="current"><a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{elseif $node->parent == true && $node->depth == 1}
<li class="top parent item"> <a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{elseif $node->depth == 1}
<li class="top item"> <a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{/foreach}
{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}
{/strip}
#7

Pour la partie current tout est bon mais c'est la partie top parent qui pose souci apparement les enfants prennent aussi cette classe

<li class="top parent item"><a href="#"<strong>Services</strong></a>

Je vais mettre en ligne la version cms simple et la version html se sera plus explicite
#8

Je reviens vers toi, j'ai mis le site cms made en ligne.

http://www.carpedieme.fr/demo-cmsmade/index.php

et voici le lien du template que j'ai pris

http://cms.template-help.com/joomla_3086...&Itemid=53


Sachant que dans le css du menu la class item n'a pas besoin de numéro ça marche pareil.

J'essaye de regarder dans tous les sens ce que tu m'a envoyé mais impossible d'avoir l'effet comme dans le template.

Encore Merci
#9

Remet le code que je t'ai donné que je voie le problème (pour le moment tu as une erreur).
#10

Oups, c'est mon code qui a une erreur Wink
#11

Code :
{strip}
{if $count > 0}
<ul class="menu-nav">
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="<div class='ulwrapper'><ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</div></li>
{elseif $node->index > 0}</li>
{/if}
{if $node->current == true && $node->depth == 1}
<li class="current"><a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{elseif $node->parent == true && $node->depth == 1}
<li class="top parent item"> <a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{elseif $node->depth == 1}
<li class="top item"> <a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{else}
<li><a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{/if}
{/foreach}
{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}
{/strip}
Si ça buggue sur le current, remet id au lieu de class (peut-être à cause du JS).
#12

Est-ce que tu utilises un séparator comme type de page ?
Je vois qu'il te faut non seulement une id, mais une classe top au current.
Et je crois que les class item se mettent via le js.
Donc :
Code :
{strip}
{if $count > 0}
<ul class="menu-nav">
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="<div class='ulwrapper'><ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</div></li>
{elseif $node->index > 0}</li>
{/if}
{if $node->current == true && $node->depth == 1}
<li class="current"><a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{elseif $node->parent == true && $node->depth == 1}
<li class="top parent"> <a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{elseif $node->depth == 1}
<li class="top"> <a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{else}
<li><a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{/if}
{/foreach}
{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}
{/strip}
Tu n'as pas le lien des explications de ce template ?
Donne-moi au moins la js que je puisse regarder son code.
#13

Et bien un grand merci pour ton aide tout marche grâce à ton code.

Super sympa

Bonne journée
#14

Pas tout à fait : place-toi sur la page "présentation et survole son onglet.

Je pense que ceci va être tip top :
Code :
{strip}
{if $count > 0}
<ul class="menu-nav">
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="<div class='ulwrapper'><ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</div></li>
{elseif $node->index > 0}</li>
{/if}
{if $node->current == true && $node->parent == true && $node->depth == 1}
<li id="current" class="top parent"><a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{elseif $node->current == true && $node->depth == 1}
<li id="current" class="top"><a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{elseif $node->current == true}
<li id="current"><a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{elseif $node->parent == true && $node->depth == 1}
<li class="top parent"> <a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{elseif $node->depth == 1}
<li class="top"> <a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{else}
<li><a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{/if}
{/foreach}
{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}
{/strip}
#15

Effectivement c'est encore mieux, j'ai remis current en class apparemment cela ne posait pas de problème, un souci que je n'avais pas vu lorsque l'on clique sur présentation et qu'on le survole à nouveaux la class " top parent item " disparait et du coup l'affichage n'est plus bon

{strip}
{if $count > 0}
<ul class="menu-nav">
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
{repeat string="<div class='ulwrapper'><ul>" times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
{repeat string="</li></ul>" times=$node->prevdepth-$node->depth}
</div></li>
{elseif $node->index > 0}</li>
{/if}
{if $node->current == true && $node->parent == true && $node->depth == 1}
<li class="current" class="top parent"><a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{elseif $node->current == true && $node->depth == 1}
<li class="current" class="top"><a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{elseif $node->current == true}
<li class="current"><a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{elseif $node->parent == true && $node->depth == 1}
<li class="top parent item"> <a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{elseif $node->depth == 1}
<li class="top parent item"> <a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{else}
<li><a href="{$node->url}" {if $node->target ne ""} target="{$node->target}"{/if}><strong>{$node->menutext}</strong></a>
{/if}
{/foreach}
{repeat string="</li></ul>" times=$node->depth-1}</li>
</ul>
{/if}
{/strip}
#16

<li class="current" class="top parent"> est erroné, plutôt <li class="top parent current " .
Est-ce que c'est bon maintenant ?
Si oui, marque [résolu] dans le titre de ce post.
#17

[Résolu]

Encore un grand merci pour ton aide tout est nikel

Bonne journée
#18

Dans le titre du post, pas dans le message Wink
Sujet fermé


Atteindre :


Utilisateur(s) parcourant ce sujet : 1 visiteur(s)