PHP Menu Items Count puis ajouter sous plus de bouton

Question

J'utilise le code ci-dessous pour charger les éléments du menu principal de certains CMS, le code actuel est parfait, sauf qu'il charge tous les éléments principaux sur une seule ligne de menu - ce qui fera la largeur de celui-ci inutilisable dans toute conception centrée (moins de 1000px) .. Je veux changer ce script ainsi après 15 éléments principaux ajouteront un bouton "PLUS" sous lequel le reste des éléments du menu principal montrera comme sous-éléments de cette Bouton "MORE" (ils n'auront pas leurs propres sous-items comme les 15 premiers). Comment puis-je le faire? Merci!

 <?php 

require_once('../../../inc/header.inc.php'); 
require_once(DIRECTORY_PATH_INC . 'membership_levels.inc.php'); 
require_once(DIRECTORY_PATH_ROOT . "templates/tmpl_{$tmpl}/scripts/TemplMenu.php"); 

      class SimpleMenu extends TemplMenu 
      { 
      function getCode() 
      { 
      $this->iElementsCntInLine = 100; 
      $this->getMenuInfo(); 
      $this->genTopItems(); 
      return $this->sCode; 
      } 

      function genTopItem($sText, $sLink, $sTarget, $sOnclick, $bActive, $iItemID, $isBold = false, $sPicture = '') 
      { 
      $sActiveStyle = ($bActive) ? ' id="tm_active"' : ''; 

      if (!$bActive) { 
      $sAlt= $sOnclick ? (' alt="' . $sOnclick . '"') : ''; 
      $sTarget = $sTarget ? (' target="_parent"') : ''; 
      } 

      $sLink = (strpos($sLink, 'http://') === false && !strlen($sOnclick)) ? $this->sSiteUrl . $sLink : $sLink; 

      $sSubMenu = $this->getAllSubMenus($iItemID); 

      $sImgTabStyle = $sPictureRep = ''; 
      if ($isBold && $sPicture != '') { 
      $sPicturePath = getTemplateIcon($sPicture); 
      $sPictureRep = "<img src='{$sPicturePath}' style='vertical-align:middle;width:16px;height:16px;' />"; 
      $sText = '&nbsp;'; 
      $sImgTabStyle = 'style="width:38px;"'; 
      } 

      $sMainSubs = ($sSubMenu=='') ? '' : " {$sSubMenu} </a>"; 
      $this->sCode .= " 

       <li><a href='{$sLink}' {$sOnclick} target='_parent'>{$sPictureRep}{$sText}</a> 
       <div id='submenu'> 
       <ul> 
       <li>{$sMainSubs}</li> 
       </ul> 
       </div> 
       </li> 
      "; 
      } 
      } 

      $objMenu = new SimpleMenu(); 
      echo "<ul id='ddmenu'>"; 
      echo $objMenu->getCode(); 
      echo "</ul>"; 

    ?> 

Answer 1

Personnellement, j'utiliser CSS et Javascript (+ jQuery) pour le faire.

Utilisez Javascript pour trouver li s dans ul#ddmenu qui ont un index de 15 ou plus, et leur donner une classe différente. Ensuite, ajoutez votre bouton "Plus" et utilisez onclick/hover etc pour afficher les li restants.