[poo] menu xhtml horizontal extensible (menuextensiblex.php)

Télécharger le projet
Commenter

Description

Bonjour,
Cet objet: MenuExtensibleX, sert à créer un menu de manière horizontal, il est extensible ce manipule facilement, ainsi il s'adapte a toutes les résolutions ou touts les contenant.
Vous pouvez téléchargez le zip du projet pour obtenir le fichier MenuExtensibleX.php et vous verrez comment votre projet doit ce présenter, de plus les images sont incluse.

présentation du fichier de teste (index.php).

Le fichier de test montre le fonctionnement de l'objet MenuExtensibleX.
Cet objet retourne le menu et aussi un tableau énumérant les erreurs éventuelle et d'autres informations grâce a la méthode getMessage() que l'on affichera dans l'exemple, mais bien évidement à supprimer lors de la fin du projet.
MenuExtensibleX prend en paramètre lors de la construction un tableau de chaine de caractères représentant le chemin de l'image et un autre prend les liens des pages cible.
Il va sans dire que les cellules des tableaux doivent correspondre, l'image au lien, et identiquement pour le tableau $attribut que nous verrons plus bas.
Vous pouvez changer la valeur de la boucle for ne dépassant bien sûr pas le nombre de vos images. Vous êtes limité dans le nombre d'entrée de votre tableau de chemin d'image à 60 cellules.
J'ai placé un div parent #general avec une valeur css width dans un attribut "style" pour que vous puissiez aisément modifier la taille du menu et voir son comportement.

Avec cette manière d'intégrer un menu via PHP fais que vous ne pouvez pas vraiment accéder au attribut des balise, a moins de retourner dans la class et de faire des modif dessus ce qui peut être gênant si l'on veut attribuer un target="_blank" dans la balise "a". C'est pourquoi on peut récupérer le menu soit avec getMenu() qui retourne l'élément par défaut, soit avec getMenuAvecLienAttribut($attribut) $attribut étant un tableau de chaine de caractères pour chaque balises "a".
N'oublier pas d'effacer getMessage() a la fin de votre projet.

Source / Exemple : 


<?php
/*


     
  •  Ceci est le fichier que teste l'objet MenuExtensibleX

    •  
  •  il faudra pour ajuster le menu a votre guise, trouver le compromis entre

    •  
  •  taille et proportion des images et la taille du div id "general" ici plus bas

    •  
  •  La taille des images ne ce genere pas en modifiant le width de la balise html

    •  
  •  "img" mais en modifiant la taille en % du div parent de class='sousMenu_x_x',

    •  
  •  ce dernier div a le css dans un attribut style, pour agire dessus avec du css

    •  
  •  il sera peut nécéssaire de forcer la valeur width avec un "!important".

    •  
  •  Observer la source html du menu pour bien distingué les id et class ainsi que

    •  
  •  les valeurs css présente dans les balises.

    •  
  • /

//on inclut l'objet MenuExtensibleX.php
include 'MenuExtensibleX.php';
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
        <title>MenuExtensibleX.php</title>
    </head>
    <body>
        <?php
        //NOMBRE MAXI=60 
        //on fait une boucle pour
        for($i=0;$i<6;$i++) {
            //récuperer le chemin des images précédement nommer menu1, menu2...
            $images[$i]="image/menu".($i+1).".png";
            //récuperer les lien ici on choisi ce même fichier
            $liens[$i]="index.php";
        }
        //on instancie l'objet
        $menu=new MenuExtensibleX($images,$liens);
        // on écrit un div parent, tres important pour controler la taille du menu
        echo '<div id="general" style="margin:auto;width:75%;">';
        //cette méthode retourne le menu il existe aussi
        //getMenuAvecLienAttribut($attribut) qui prend un Array String
        //repésentant des attribut pour la balise a ex: target="_blank"
        echo $menu->getMenu();
        //on ferme le div
        echo '</div>';
        //cette méthode retourne un tableau d'énumération des données passé
        //en paramètre de l'objet, elle est facultative
        echo $menu->getMessage();
        ?>
    </body>
</html>

Conclusion :


Un point sur l'xhtml.

L'élément html Comporte pour chacune de ces balises composantes des "class" et des "id".
Les class et les id sont généré dynamiquement a l'aide entre autre de clef crée a partir de vos fichier, on ne peut pas connaitre a l'avance les id ou class, C'est pourquoi il est vivement conseillé de visualiser la source html du menu pour les connaitre. De cette manière vous pourrez consulter le contenue des attributs "style" contenue dans les balises et connaitre les valeurs css a forcer.
l'élément retourner par getMenu() est un div évoluant a 100% de la longueur de son conteneur parent, il contient un nombre variable de div représentant chaque lien du menu et c'est ces div qui sont importants. Ces div évoluent a un certain pourcentage équivalant a 100(%) divisé par le nombre de lien, avec du css, on agirai sur le width de ces div (class='sousMenu_x_x') avec un "!important" (pour réduire la taille des images il vaut mieux encore réduire la taille du div parent #general). les balises img a l'intérieur de ces div (class='sousMenu_x_x') évoluent a 100% de ceux la, il faut donc réduire leurs taille pour ajuster la taille des images.

citation d'un commentaire:
"Il faudra pour ajuster le menu a votre guise, trouver le compromis entre taille et proportion des images et la taille du div id "general". La taille des images ne ce change de préférence pas en modifiant le width de la balise html "img" mais en modifiant la taille en % du div parent de class='sousMenu_x_x'".
Télécharger le projet

Codes Sources

A voir également

S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Du même auteur (dariumis)