Menu (encore...)

Soyez le premier à donner votre avis sur cette source.

Snippet vu 8 011 fois - Téléchargée 28 fois

Contenu du snippet

Je me baladais tranquilement sur ce joli site (et tout et tout) dans la rubrique "menu", lorsque me vint l'idée d'essayer moi aussi ces jolis menu tout beau (ou tout moche, à voir...).
Voici finalement l'aboutissement de longues secondes de réflexion (ou plutot de la recherche de celui que jai fait hier pour mon site, et de son adaptation).

Source / Exemple :


<!-- Script -->
<script>
var etat = 0;

//pour le block
function dynam_p1() {
	if (etat == 1)
		{document.all.planque1.style.display = "none";
		etat = 0;
		}
	else
		{document.all.planque1.style.display = "block";
		etat = 1;
		}
	}
	
//pour le tableau
function dynam_p2() {
	if (etat == 1)
		{document.all.planque2.style.display = "none";
		etat = 0;
		}
	else
		{document.all.planque2.style.display = "block";
		etat = 1;
		}
	}
</script>

<!-- Style, histoire d'égayer un peu tout ça. -->
<style>
a {color: Grey;}
#planque1, #planque2 {	display: none;}
.menu {
	margin: 0px 0px 5px 0px;
	color: White;
	background: Black;
	border: 1px solid red;
	width: 150px}
.titre {
	margin: 0px;
	border-bottom: 1px solid red;
	font-size: 110%;}
</style>

<!-- Partie en HTML -->

<!-- Avec un block -->
<div class="menu"> 
  <p class="titre"><a href="#" onClick="dynam_p1()">>Menu</a></p>
  <ul id="planque1">
    <li>Element 1</li>
    <li>Element 2</li>
    <li>Element 3</li><br>
  </ul>
</div>
<br>

<!-- Ou avec un tableau -->
<div class="menu"><a href="#" onClick="dynam_p2()">>Menu</a></div>
<table width="151px" border="1" class="menu" id="planque2">
  <tr border="1">
    <td>Element 1</td>
  </tr>
  <tr border="1">
    <td>Element 2</td>
  </tr>
  <tr border="1">
    <td>Element 3</td>
  </tr>
</table>

Conclusion :


Merci à moi-même pour mon humour, ainsi qu'à ma personne pour son égocentrisme.
Non mais blague à part, rien à ajouter.
Pas testé sous IE (Firefow powa! :p)

A voir également

Ajouter un commentaire

Commentaires

Sannazzarotiti
Messages postés
228
Date d'inscription
jeudi 1 septembre 2005
Statut
Membre
Dernière intervention
12 avril 2009

J'adore ta source, mais pourait tu mettre la mettre dans un fichier zip stp car il y a des numero de ligne quadn tu fait copier coller.

Au niveau du code je ne connait presque rien au javascript et je ne peut donc pas trop te noter sur ce point.
kiki2sirom
Messages postés
153
Date d'inscription
mardi 17 août 2004
Statut
Membre
Dernière intervention
23 décembre 2010

Oui alors, heu, tu testes quelque chose sur Firefox qui pour toi marche, mais non !!!, et tu ne l'as pas testé sous IE, je te confirme que ça marche sous IE.

Tu prends quelque chose ??

1°) <!-- Style, histoire d'égayer un peu tout ça. -->
heu, tu plaisantes, j'espère... ton menu est quand même super laid, désolé de te le dire...

2°) De plus, préférer, à mon avis, mettre le CSS dans un fichier séparé, si on veut utiliser ce menu à plus "grande" échelle, sinon ça va vite devenir illisible.

je ne m'y connais pas assez pour juger la syntaxe du CSS, mais ...(si quelqu'un pouvait juger pour moi)

3°) ne fonctionne pas sous Firefox (comme précisé ci-dessus) : le menu ne se "déroule" pas

4°) les 2 fonctions peuvent être regroupées en 1 seule, évidemment, si tu remarques bien, elles font quasiment la même chose avec les mêmes données.

Il faut donc penser au passage de paramètres.

cordialement

kiki
Sannazzarotiti
Messages postés
228
Date d'inscription
jeudi 1 septembre 2005
Statut
Membre
Dernière intervention
12 avril 2009

Mon avis sur ton commentaire
1°) Je le trouve beau, il faut juste le modifiez a son gout
2°) D'accord avec toi
3°) Moi j'ai firefox 1.6 et sa marche parfaitement et pareil qur IE
4°) Peut etre, je te fait confiance.

Pour le css c'est pas bien espacer par contre,

<style>
a
{
color: Grey;
}

#planque1, #planque2
{
display: none;
}

.menu
{
margin-left:5px;
color: White;
background-color: Black;
border: 1px solid red;
width: 150px
}
.titre
{
margin: 0px;
border-bottom: 1px solid red;
font-size: 110%;
}
</style>

J'ai juste mieu mis en page et corriger certain truc (comme background en background-color)
kiki2sirom
Messages postés
153
Date d'inscription
mardi 17 août 2004
Statut
Membre
Dernière intervention
23 décembre 2010

Re
1°) question de goûts et de couleurs : perso, gris sur fond noir, moyen...
3°) marche pas chez moi sous Firefox 1.5 : bizarre cette histoire...

kiki
Sannazzarotiti
Messages postés
228
Date d'inscription
jeudi 1 septembre 2005
Statut
Membre
Dernière intervention
12 avril 2009

Oué pour le 1 je suis d'accord, donc il serait compatible avec firefox 1.6 et pas le 1.5

Quelqu'un qui a le 1.5 pourait t'il comfirmé? (histoire d'etre vraiment sur)

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.