Menus "à la frame" sans frame :-) - Forum HTML / CSS / XHTML

La Communauté Webmaster

  Forum-webmaster
  Technique - programmation
  HTML / CSS / XHTML (Modérateurs: Shain, Netah, Lilian, lauryv, ToToMaStEr)
  Menus "à la frame" sans frame :-)

« Précédent Suivant »

Pages: [1]

Auteur

Sujet: Menus "à la frame" sans frame :-) (Lu 1656 fois)

Menus "à la frame" sans frame :-)
« sur: le 13-12-2006 a 03:19:19 »

Jelpy
Membre récent

Hors-Ligne

Sexe: Male

Messages: 2

Bonjour,

Je m'explique: j'ai achté un kit graphique pour faire un portail.

Cependant aujourd'hui on n'utilise plus de frames qui avaient l'avantage de séparer la structure de navigation et les contenus des pages: on n'avais qu'a modifier la structure une seule fois à chaque ajout de page.

Mais aujourd'hui, et notemment avec mon kit graphique, sans frame pour gérer le menu séparément ça devient vite super compliqué au delà d'une dizaine de page et ça s'arrange pas à chaque nouvelle page. Puisque le menu est alors du simple texte lié aux autres pages. Il faudrait donc rouvrir toutes les pages, rajouter les textes des liens et créer les liens idoines. Un vrai casse-tête et surtout une perte de temps énorme.

Comment gérer de multiples menus (en haut à gauche et en bas de page)? En DHTML? en CSS, en JavaScript?

En fait, seul le menu de gauche serait assez compliqué, les autres menus étant juste liés à une seule page en principe, soit la première page de la rubrique.

Où trouver des indications concrètes sur le net ou un bouquin? voir y a-t-il un programme pour générer facilement un menu simple avec un niveau de sous-menus.

Voir la copie d'écran de ce que j'ai et que j'ai complété en bidouillant avec un prog graphique pour expliciter le résultat voulu; en cliquant par exemple sur "Alimentation" on déroule le sous-menu listant les options du sous menu; et en cliquant sur un sous menu on accède à la page désirée, laquelle affichera toujours le même menu:

Merci pour tout tuyau utile.

Jelpy

Rapporter au modérateur

Re:Menus "à la frame" sans frame :-)
« Répondre #1 sur: le 13-12-2006 a 04:41:52 »

theonlydrayk
Invité

Bonjour,

Faire des menu pour des dizaines de page statiques je comprend que c'est un travail enorme.

Les sites web aujourdhui avec un menu sans frame sont fait avec un script qui inclus le menu dans toute les pages. Personne ne fait de copier-coller le menu 15 fois !!

Tu devrais t'orienter vers un script PHP si ton hebergeur est sous linux ou ASP si ton hebergeur est sous Windows.

Rapporter au modérateur

Re:Menus "à la frame" sans frame :-)
« Répondre #2 sur: le 14-12-2006 a 21:10:39 »

TinMar
Habitué

Hors-Ligne

Sexe: Male

Messages: 268

Yo !

Bon j'ai un peu bossé pour toi pour la partie HTML; il va falloir que tu te mettes au PHP (au moins les bases)!
Voila ce que je ferrais. c'est à titre indicatif.
Si d'autres personnes ont d'autres solution je suis aussi interessé.

Pour le menu tu vas voir sur
http://tinmarweb.free.fr/FWM/testmenu/test-menu.html
Tu trouveras le menu en CSS avec la page suivante:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
<title>test</title>
<style type="text/css">

</style>

</head>
<body>
<ul id="menu">
<li><a href="#">Administration</a></li>

<li class="active"><a href="#">Alimentation</a>
<ul>
<li><a href="#">Alimentation diététique</a></li>
<li><a href="#">Boulangeries</a></li>
<li><a href="#">Cafés-Restaurant</a></li>

</ul>
</li>
<li><a href="#">Animaux</a>
<ul>
<li><a href="#">Alimentation diététique</a></li>
<li><a href="#">Boulangeries</a></li>

<li><a href="#">Cafés-Restaurant</a></li>
</ul>
</li>
<li><a href="#">Arts & Antiquités</a></li>
<li><a href="#">Assurances</a></li>

<li><a href="#">Autos / Motos</a></li>
</ul>
</body>
</html>

En regardant le menu tu vois qu'il n'y a que un sous menu dans la partie Alimentation. Par contre dans le CODE il y en a aussi un dans sous Animaux. En gros en ajoutant le code class="active" tu affiche et cache les sous menu.

Apres tu fais intervenir le PHP pour:
- faire tes pseudo frame http://css.alsacreations.com/Faire-une-mise-en-page-sans-tableaux/Construire-un-site-sans-tableaux
- ensuite avec une ptite fonction PHP tu fais apparaitre l'élément class="active" en fonction de la page.

A+

« Dernière Édition: le 14-12-2006 a 21:11:29 par TinMar »

Rapporter au modérateur

Re:Menus "à la frame" sans frame :-)
« Répondre #3 sur: le 15-12-2006 a 01:40:40 »

Jelpy
Membre récent

Hors-Ligne

Sexe: Male

Messages: 2

ouaaah super et merci TinMar !!

J'apprend plein de trucs intéressants avec ton code.

En effet, et par exemple, le concepteur de mon kit a fait un tableau compliqué pour le menu avec des lignes graphiques pleines (cadre) ou traitillées (entre les lignes), ce qui fait que c'est super galère pour ajouter un élément parce que tu dois dupliquer la ligne de texte ET la ligne du tableau contenant l'image de la ligne. Trop galère!!

Possiblement parce que le kit a été créé avec Photoshop, lequel transcrit très certainement le cadre et les lignes traitillées en images dans un tableau!!

Mais là, il suffit de déclarer tes lignes par du texte; balèze et souple!!

C'est sûr que je vais pouvoir le réutiliser!!

Et merci pour les liens aussi. J'ai zieuté un coup, mais pas trop le temps de lire ce soir, et zou classé dans mes favoris.

Par contre je veux éviter de placer le code du remplissage du menu dans la page elle même pour éviter de ré-ouvrir chaque page déjà créée pour rajouter les éléments correspondants à chaque fois que je rajoute une nouvelle page.

Mon but est d'externaliser les éléments et la structure de mon menu et les liens respectifs et de seulement déclarer la position du menu au bon endroit sur chaque page.

Exactement comme on le fait d'une image: l'image est un fichier externe qui est déclaré le nombre de fois voulu dans toutes les pages voulues.

Si t'as la même puce rouge affichée 5 fois sur chacune des 50 pages de ton site, tu la déclare partout au bon endroit; du genre <a ref trucbidule "puce.gif" etc. Maintenant tu te dis je veux une puce bleue à la place, tu n'as absolument rien à modifier dans tes pages, tu remplace juste la couleur de ta puce dans ton fichier puce.gif et tu upload l'image. Maintenant partout dans ton site tes puces sont bleues.

Donc l'idée est de faire pareil avec le menu: déclarer dans toutes tes pages à l'endroit voulu genre <a ref machinchose "menu1.css" (ou menu1.php ou je ne sais pas trop quoi), etc. Et tu n'as plus jamais à modifier ton menu1 dans tes 50 ou 100 pages.

Seul le fichier "menu1.css" (ou menu1.php, ou que sais-je, suivant la technique/language utilisé) contiendra --et une seule fois dans tout ton site-- la structure comprenant les éléments, sous-menus et liens. Et ça te fait un seul endroit dans lequel ajouter/modifier tes éléments de menu avec les liens correspondants à chaque ajout d'une nouvelle page.

Rapporter au modérateur

Re:Menus "à la frame" sans frame :-)
« Répondre #4 sur: le 15-12-2006 a 07:43:25 »

TinMar
Habitué

Hors-Ligne

Sexe: Male

Messages: 268

Yo !

ben pas de pb c'est le principe des pseudo frame. Tu trouveras tt dans alsacreations et sinon en cherchant dans google à "pseudo frame".

Bon courage

Rapporter au modérateur

Re:Menus "à la frame" sans frame :-)
« Répondre #5 sur: le 04-01-2007 a 13:31:57 »

boy
Membre récent

Hors-Ligne

Sexe: Male

Messages: 27

Je suis un fou de php/mysql et de mmo

Bonjour !

J'aimerais bien avoir des infos sur l'utilisation de php pour mettre à jour, je suis pas trop féru de css pour le moment ^^

Genre faire un "echo" d'une nouvelle définition de la classe div ?

« Dernière Édition: le 04-01-2007 a 13:33:30 par boy »

Rapporter au modérateur

"Etant issu des étoiles, la connaissance est en nous, il suffit de la trouver. Pourtant, la science s'évertue à la chercher"

Re:Menus "à la frame" sans frame :-)
« Répondre #6 sur: le 04-01-2007 a 20:12:35 »

TinMar
Habitué

Hors-Ligne

Sexe: Male

Messages: 268

Yo !

Le CSS est indépendant du PHP. Le PHP permet de générer du code, le CSS permet de mettre en page.
Je ne vois pas trop ce que tu veux avec les ECHO.

Rapporter au modérateur

Re:Menus "ï¿½ la frame" sans frame :-)
« Répondre #7 sur: le 04-01-2007 a 23:32:39 »

boy
Membre récent

Hors-Ligne

Sexe: Male

Messages: 27

Je suis un fou de php/mysql et de mmo

Vu qu'il n'est PAS possible de modifier une donnÃ©e sans utiliser au minimum une pseudo frame et donc forcÃ©ment recharger l'index en entier pour actualiser la pseudo frame index.php?action=tutu, je me suis dit qu'en envoyant des dÃ©finitions css avec une commande php "echo" depuis cette page pouvait modifier uniquement le ou les tag css de cette page sans avoir a la recharger ...

En clair, se servir de la commande php "echo" pour n'envoyer qu'une modification CSS Ã la page, pour que cette modification soit rÃ©percutÃ©e sans avoir a recharger toute la page.

Moi je vois que cette solution pour ne pas avoir a recharger la page. Chose qui est totalement possible avec une iframe et qui me va super mÃ©ga bien. Vous voyez ce que je veux dire ?

Si j'ai 49900 milliards d'Ã©lÃ©ments sur une seule page et que je veux juste changer 1 Ã©lÃ©ment de cette page par exemple ....

Vu qu'avec l'iframe, on peut modifier QUE le contenu d'un cadre sans avoir a ne serais-ce que toucher Ã quoi que ce soit d'autre.

« Dernière Édition: le 04-01-2007 a 23:36:45 par boy »

Rapporter au modérateur

"Etant issu des étoiles, la connaissance est en nous, il suffit de la trouver. Pourtant, la science s'évertue à la chercher"

Re:Menus "à la frame" sans frame :-)
« Répondre #8 sur: le 05-01-2007 a 19:24:25 »

TinMar
Habitué

Hors-Ligne

Sexe: Male

Messages: 268

Yo !

on comprend pas ce que tu appelles éléments?

En gros dans ta page tu as:
- Ta mise en page (incluant couleur taille etc des polices) qui est géré par UN SEUL fichier CSS. Dc si tu le modifies 1 fois tu le fais pour TOUTES les pages

- Ton menu et ton contenu (du texte)
Le but du PHP d'afficher un contenu en fonction de variable. Ca peut etre dans une page seulement (index.php) et si c'est le cas, a chaque chargement elle se rafraichirera entierement ce qu'il ne veut pas dire qu'elle chargera les éléments de ta page (genre image, menu etc) à chaque fois

Rapporter au modérateur