High-Tech Santé Médecine Droit-Finances

Auto-Entrepreneur

Comment faire ?

Rechercher : dans
Par :

Créer un menu avec XHTML/CSS

Dernière réponse le 10 jan 2009 à 00:19:12 Ranuzel, le 9 jan 2009 à 00:37:03 
 Signaler ce message aux modérateurs

Bonjour,

Je souhaite créer un menu tel qu'un clic ou un passage de la souris sur un item du menu principal, ouvre un pop-up proposant un choix dans un sous-menu.

A votre disposition pour toute précision si ma question manque de clarté.

Merci à tous

Configuration: Firefox 3.0.5

Meilleures réponses pour « créer un menu avec XHTML/CSS » dans :
Créer un site beau, dynamique et respectueux des standards VoirVoici une liste de liens qui vous aideront à mieux exploiter les standards (HTML, CSS, DOM...) pour créer des sites plus beaux, plus dynamiques et plus respectueux des standards. A la fin de cette page, il y a également une liste de...
[CSS] Créer facilement des CSS VoirUn outil très facile d'utilisation pour créer des CSS, avec un aperçu en direct de ce que vous créez : TopStyle. La version Lite est gratuite. www.topstyle4.com
Feuilles de style - CSS VoirPrésentation des feuilles de style Le concept de feuilles de style est apparu en 1996 avec la publication par le W3C d'une nouvelle recommandation intitulée « Cascading StyleSheets » (feuilles de style en cascade), notée CSS. Le principe des...
Posez votre question Répondre

1

RAD ZONE, le 9 jan 2009 à 01:25:16

?? tu veux ouvrir ds pop up comme menu ????????????

tu as due mal t exprimer ou j ai mal compris ! ,-))
♣  La plus grande erreur que puisse faire un homme est d'avoir peur d'en faire une. ♣

   
Répondre à RAD ZONE

2

Ranuzel, le 9 jan 2009 à 09:02:45

Oui, je me suis surement mal exprimé.
En fait il ne s'agit pas d'un pop_up mais d'une petite fenêtre ou encore d'une petite case dans laquelle s'affiche un nouveau choix: menu A1/ Menu A2 quelque chose de très classique en matière de menu mais que je na sais pas réaliser.

Merci de ton attention

   
Répondre à Ranuzel

3

RAD ZONE, le 9 jan 2009 à 13:39:04

http://www.commentcamarche.net/forum/affich 10393301 creation des menu des lien?#8
♣  La plus grande erreur que puisse faire un homme est d'avoir peur d'en faire une. ♣

   
Répondre à RAD ZONE

4

Ranuzel, le 9 jan 2009 à 21:28:57

Merci RAD ZONE.
je suis donc allé voir la cible de ce lien:

RAD ZONE, le vendredi 9 janvier 2009 à 01:03:02
En voila un vite fais en html css ! tu adapte a tes besoins

J'ai copié les fichiers html et css et cela donne exactement ce que je souhaite obtenir.( sous réserve de quelques modifications de détail concernant le style)

Malheureusement, je n'ai pas compris le principe du fonctionnement et je suis donc incapable de reproduire un tel menu. Il se trouve que comprendre est mon objectif premier, l'aspect utilitaire étant secondaire.

Résumons:

Si je lance le seul fichier html sans le style, j'obtiens quelque chose que je sais faire: Un menu et des sous-menus affichés à l'écran.
Ce que je ne sais pas faire, c'est cacher les sub-menus jusqu'au survol par la souris.

J'observe que dans la page html pure , le seul appel au style tient dans la ligne suivante:
<div class="rad_menu ">

fait-on appel ici à l'ensemble des .rad_menu *** de la partie <style> de l'en_tête?

Dans ces .rad_menu, lequel permet de cacher ces "sub-menus" ?

Sans doute suis-je très "primaire" mais, désolé, c'est mon niveau actuel.

Merci de ton aide.

   
Répondre à Ranuzel

5

RAD ZONE, le 9 jan 2009 à 22:06:09

SALUT

LOLLL

je vois que tu ne connais pas le CSS ! ;-))
tu peux lire tout le tuto ! mais voila le chapitre qui t interesse!
http://www.siteduzero.com/...

bon pour le menu !!

dans le html un menu avec 2 sub menu est ecris 

<ul><li>
        <a href="#">Home</a>
        <ul><li>
          <a href="#"  > sub-menu 1</a></li><li>
          <a href="#"  > sub-menu 2</a></li>
        </ul></li>
      </ul>


maintenant si tu regarde dans le CSS embarque ( en haut dans le style )!

en cherchant tu vas trouver 
.rad_menu ul li ul { /*<--- pour selectioner seulement le ul ce trouvant dans un ul et un li */
	display: none; /*<------------- ici le display:none;  cache  les 2 submenu */
	border: none;
	color: #0F57FF;
	background: #9FBCFF;
	width: 1px
}


ET plus loingt tu vas trouver le hover qui avec le "display:block;" les fait apparaitre !! 

.rad_menu ul li:hover ul {
	display: block;
	position: absolute;
	z-index: 999;
	top: 29px;
	margin-top: 1px;
	left: 0;
}


mais regarde le tuto pour avoir les bases du CSS tu vas vite comprendre !!

RAD
♣  La plus grande erreur que puisse faire un homme est d'avoir peur d'en faire une. ♣

   
Répondre à RAD ZONE

6

 Ranuzel, le 10 jan 2009 à 00:19:12

Un grand merci pour ces explications claires.

   
Répondre à Ranuzel
Posez votre question Répondre
Ils ont besoin de votre aide