Menu en images. (Page 1) / Le site: tuto-fr.com / Forum d'entraide: tuto-fr.com

Annonce

Visitez la boutique Wifi-highpower.com, votre revendeur agréé Alfa Network: du matériel Wifi sélectionné, cartes Wifi USB Awus036h et Awus036nh, antennes omnis, yagis, panel, amplis wifi, accessoires...

#1 23-07-2006 19:56:43

sly_31415
Membre
Inscription : 23-07-2006
Messages : 10

Menu en images.

Bonjour,
Tout d'abord bravo et merci pour cet excellent travail (me fait un peu peur le réseau WEP...).
J'ai voulu intégré le menu du site http://www.tuto-fr.com/tutoriaux/tutori … nt-css.php, mais en utilisant des images et non du texte.
Et j'ai un souci : sous les images, j'ai une barre transparente qui m'embête un peu ! J'ai essayé le menu d'Alsacréation avec le même problème. Et n'ayant que peu de connaissance dans ce langage, j'ai testé plusieurs choses sans succès.
Cependant, ici, avec Firefox, j'ai résolu le problème en rajoutant une ligne de code dans mon fichier css :

#menu img {display: block;}

En contre-partie, cela devient du n'importe quoi sous Internet Explorer. Je vous laisse contempler le carnage wink: http://sylvain.etienne1.free.fr/gestclasse_v7/.
Si une bonne âme, ayant pitié de moi roll pouvait me dire quelle(s) ligne(s) rajouter pour ne plus avoir de "trous" dans tous les navigateurs, cela m'arrangerait beaucoup.

Autre souci, j'ai ramené les premiers sous-menus pour les avoir en face de collège grâce à

margin-top: -90px;

.
J'aimerais faire de même avec les deuxièmes sous-menus correspondants à CAPES, donc avoir un margin-top de -30px et non -90...

Je vous remercie par avance.

Hors Ligne

Annonce

Visitez la boutique Wifi-highpower.com, votre revendeur agréé Alfa Network: du matériel Wifi sélectionné, cartes Wifi USB Awus036h et Awus036nh, antennes omnis, yagis, panel, amplis wifi, accessoires...

#2 24-07-2006 13:43:41

ItIsHardToProgram
Membre
Inscription : 09-06-2006
Messages : 118

Re : Menu en images.

Ouashhh...!!!!! commence par changer les images!!!!!!!

Hors Ligne

#3 24-07-2006 13:55:29

Billyboylindien
Membre d'honneur
Inscription : 06-10-2005
Messages : 1 561
Site Web

Re : Menu en images.

c'est vrai que moi non plus j'accroche pas trop hmm

Et choisir un menu comme ca ca a l'avantage de l'accessibilité mais la avec les image, tu a interet de mettre des alt hmm

++


Les cartes wifi recommandée et testées
Billyboylindien parle d'informatique (un peu wink ).

Proposez vous aussi vos tutos sur tout les sujets (web, prog, bricolage ...)

Hors Ligne

#4 24-07-2006 14:13:21

zac
Membre d'honneur
Inscription : 22-06-2006
Messages : 678

Re : Menu en images.

uep les images ne sont pas top top :s et trop lourd à mon goût

Hors Ligne

#5 24-07-2006 18:43:02

sly_31415
Membre
Inscription : 23-07-2006
Messages : 10

Re : Menu en images.

Bonjour.
Le site est à destination principalement de mes élèves de collège (donc, en gros, faut des couleurs pour ces pauvres petits). Ensuite, je ne fais que des essais, donc ces images vont sans changer, mais le concept image me semble intéressant (pour moi tongue). De plus, je n'ai absolument pas créé ces images pour le web (trop lourdes). Dernier point, je suis chez Free qui est assez lent. Et pour ceux qui pensait que j'avais fini, j'ai mis des alt (euh, je crois).

Bon, maintenant que je me suis (un peu) défendu et défoulé big_smile, passons aux choses sérieuses !
Je n'ai toujours pas de réponses sur comment faire ; ce devrait être un joli défi roll...

Sinon, il me reste d'autres solutions comme le flash, du coup, le nom de l'auteur n'apparaîtra pas dans mes pages...

(au cas où : le premier paragraphe est à prendre avec humour (sait-on jamais, des fois que je me fasse bouter du forum...:lol:).

@+.

Dernière modification par sly_31415 (24-07-2006 18:43:41)

Hors Ligne

#6 24-07-2006 20:30:50

Billyboylindien
Membre d'honneur
Inscription : 06-10-2005
Messages : 1 561
Site Web

Re : Menu en images.

sly_31415 a écrit :

ce devrait être un joli défi roll...

Ils ont pas changé ces profs de college, toujours les meme, des malins, des malins, je vous dis wink.

Je vais qd meme jeter un oeil big_smile

Des malins ... big_smile


Les cartes wifi recommandée et testées
Billyboylindien parle d'informatique (un peu wink ).

Proposez vous aussi vos tutos sur tout les sujets (web, prog, bricolage ...)

Hors Ligne

#7 24-07-2006 20:45:20

ItIsHardToProgram
Membre
Inscription : 09-06-2006
Messages : 118

Re : Menu en images.

Sinon, il me reste d'autres solutions comme le flash, du coup, le nom de l'auteur n'apparaîtra pas dans mes pages...

C'est sur que pour les impressionés c'est giga... mais il faut tout de même garder une ergonomie, le site que tu as présenté ressemble un peu au site de manga/jeu d'ordinateur que l'on retrouve sur le net..... (je parle présentement)

bon le flash c'Est encore plus dure alors bonne chance =/... une animation c'est facile, un site c'est plus trucqué rendu a mettre en ligne......

bon pour ton menu, une petite suggestion, diminue le FONT et surtout rapetisse tes images, colle ton menu à l'idée de billyboy et tuto-fr, puis arrange les distance avec tes sous-menus... ca devrait déjà être moins pire =/
En tant qu'élève (université) ca ne prend pas des belles images pour m'impressioner =/ mais par contre un site très bien géré, efficace, avec contenue interessant, c'est toujours mieux big_smile

Ils ont pas changé ces profs de college, toujours les meme, des malins, des malins, je vous dis .

Arf ça c'est vrai... lol

Hors Ligne

#8 24-07-2006 20:57:22

ItIsHardToProgram
Membre
Inscription : 09-06-2006
Messages : 118

Re : Menu en images.

Bon... a bien regarder je vois ce que tu veux faire......

commence par changer de fond d'écran, c'est pas super rouge sur blanc, avec du noir un peu partout... change surtout ta banner d'introduction.. c'est affreux, met la p-e dans ta fenêtre de menu sur le dessus si tu la veux omniprésente, mais on devrait au moins voir une introduction lorsqu'on ouvre ton site... bon pour ce qui est des menus... habituellement on garde un modèle de menu STANDARD lorsqu'on ouvre ton site, les menus devraient être pareil (.... pas besoins d'autant de menu, habituellement simplement un suffit.....) p-e penser à juste mettre le login dans la fenêtre du haut...

Bon c'est mes suggestions vite fait.... moi je mettrais mon menu en couleur bleu, ou dérivé de bleu, mais pas rouge et noir, ca l'irait mieux avec ton site.....

+ tu devrais tout le temps garder le même template pour tes liens.... donc le menu devrait s'afficher partout ou presque... puis lorsque tu veux qu'il ne s'affiche pas, un pop-up s'avère utile....

Mais bon pour en revenir aux choses les plus importante, change la disposition de banière, change de menu, et ca serait très sympa!

big_smile

Hors Ligne

#9 24-07-2006 22:22:25

ItIsHardToProgram
Membre
Inscription : 09-06-2006
Messages : 118

Re : Menu en images.

utilise juste ta dernière banner, et utilise le même type d'écriture (word art ou kekechose dans le genre j'imagine) pour ton menu, si tu tiens absolument a avoir des images... ca pourrait être mieux...

Hors Ligne

#10 24-07-2006 23:11:03

sly_31415
Membre
Inscription : 23-07-2006
Messages : 10

Re : Menu en images.

Ah, cela me fait un peu plus plaisir tous ces messages critiques mais très constructifs big_smile.

Ma marge de manoeuvre n'est pas très grande car j'utilise un script php d'un collègue et ce n'est pas sûr qu'il accepte trop de changements (et je n'arrive pas à le joindre, il parait que c'est les vacances tongue). Le logo Gest'Classe restera obligatoirement, mais mon site à l'avis unanime d'une personne s'appelle Animathix.

En ce qui concerne les deux menus (un vertical et l'autre horizontal) un seul restera si la permission m'est accordée.

Pour la page d'introduction, j'en ai déjà une (qu'il faudra un peu reprendre, mais l'été n'est pas fini...) issue du site web en html que j'avais fait l'année dernière.

Pour les couleurs du menu, je précise à nouveau que je ne fais que m'amuser avec The Gimp et je pense faire effectivement quelque chose dans les tons bleus.

En ce qui concerne le font, j'ai mis : font-size=0; cela a effectivement bien réduit les bandes blanches sous Internet Explorer. Mais pour les supprimer complètement !?

En tant qu'élève (université) ca ne prend pas des belles images pour m'impressioner.

Va demander à des élèves de collège s'ils ont le même avis lol.

Ils ont pas changé ces profs de college, toujours les meme, des malins, des malins, je vous dis.

Qui a vendu la mêche, hein, qui, levez le doigt ! lol

Merci pour votre promptitude et vos avis.

Hors Ligne

#11 25-07-2006 14:16:34

ItIsHardToProgram
Membre
Inscription : 09-06-2006
Messages : 118

Re : Menu en images.

Ouf j'ai lu la source de ton site et c'est très lourd un tableau comme ca..... j'aurais préféré voir 3 page différente, une pour le menu de gauche, une pour le menu du haut, puis la page du millieu avec un tableau, une page pour toute les joindre

tu crois que tu pourrais essayer, peut-être que ton problème de bordure est justement grâce à ce magnifique tableau... mon je lance une tomate dans les airs bien sur =/

Hors Ligne

#12 25-07-2006 14:24:04

ItIsHardToProgram
Membre
Inscription : 09-06-2006
Messages : 118

Re : Menu en images.

Premièrement enlève le paramêtre Border

Ensuite diminue un peu la grosseur de tes images et dans ton code ton Width et height.... voir si ca fait une différence....

et hop une autre tomate de lancé.....

Hors Ligne

#13 25-07-2006 15:24:02

ItIsHardToProgram
Membre
Inscription : 09-06-2006
Messages : 118

Re : Menu en images.

bon j'ai tout essayé je vois vraiment rien, semblerait que tu as un problème qui est relié au type de menu.... peut-être qu'il y a un work around, mais je suis pas familier.....

bonne chance

Hors Ligne

#14 25-07-2006 17:33:39

sly_31415
Membre
Inscription : 23-07-2006
Messages : 10

Re : Menu en images.

Merci pour ces remarques.

Le script php Gest'Classe permet, pour des fainéants comme moi tongue ou ceux qui ne comprennent pas ce langage (bon, d'accord, encore comme moi roll), de mettre en ligne les pages web sans rien connaitre au php, en utilisant un éditeur de texte directement. Ce script est fait par un professeur de mathématiques et pas d'informatique et donc, je comprends fort bien tes histoires de pages et les siennes.
Quand je m'y connaîtrais un peu mieux (si tenté que cela arrive un jour), j'essayerais de faire comme tu dis, je pense en effet que ce sera mieux (surtout qu'il va falloir intégrer le menu de partout, donc avoir une frame pour le menu - à méditer...).

Passons à la bonne nouvelle big_smile : j'ai réussi à supprimer les bandes blanches à force de mes pie... euh d'acharnement dirons-nous.
J'ignore encore les raisons de mes modifications, mais je mets ci-dessous le fichier .css modifié (je suis sûr qu'il y a beaucoup de choses inutiles) :

/*issu de http://www.tuto-fr.com/tutoriaux/tutorial-menu-deroulant-css.php*/
div#menu img {
 display: block;
}
div#menu a {
 border:0;
}
div#menu {
 width: 190px;
}
body {behavior: url(csshover.htc);}
div#menu ul {
 padding: 0;
 width: 190px;
 border:0px;
 margin:0px none;
 line-height: 1px;
}
div#menu li.sousmenu {
 background: white;
 height: 30px;
}
div#menu ul li {
 position:relative;
 list-style: none;
 border-bottom:0px none;
 font-size:0;
}
div#menu ul ul {
 position: absolute;
 top: 0;
 left: 190px;
 display:none;
 margin-top: -90px;
 font-size:0;
}
div#menu li a {
 text-decoration: none;
 font-size:0;
 border:0px;
 height: 30px;
}
div#menu ul.niveau1 li.sousmenu:hover ul.niveau2, 
div#menu ul.niveau2 li.sousmenu:hover ul.niveau3 {display:block;}

La place du body est très importante apparemment.

J'ai lu "work around" dans ton précédent message et après recherche, je ne sais pas ce que c'est !?

Rien à voir avec la choucroute, mais mon écran est large avec une grosse résolution et j'aimerais un petit programme qui montre l'écran en 800x600, 1024x768, etc. sans avoir à le faire manuellement. Et puis, s'il pouvais donner le temps d'affichage des pages php, ce serait bien cool.

Bon, je sais, j'en demande beaucoup wink.
Merci encore.

Hors Ligne

#15 25-07-2006 17:42:07

sly_31415
Membre
Inscription : 23-07-2006
Messages : 10

Re : Menu en images.

Avant de mettre Régler, j'ai oublié un autre problème (je ne le refaireais plus, promis) :
Comment avoir des margin-top différents pour deux sous-menus dans le même menu ?
En utilisant peut-être un id pour le deuxième sous-menu ; j'ai essayé mais sans succès.

Bon, @ bientôt...

Hors Ligne

#16 25-07-2006 18:09:29

ItIsHardToProgram
Membre
Inscription : 09-06-2006
Messages : 118

Re : Menu en images.

redimensionner les pages web n'est pas si compliqué, il y a un paquet de FAQ sur le web, mais ce n'est pas conseillé.... à toi de voir....

Bon c'est vrai qu'il y a un paquet d'affaire innutile dans le css, mais heureux de savoir que ca l'a fonctionné =/ moi je me casse la tête présentement avec ma base de donnée.....

Pour les margins il faut probablement créer deux menu avec deux css... je peux pas vraiment t'aider je suis pas familié =/, sinon p-e que si tu enlèves la spécification dans le body, et tu la places pour chaque sous-menu, ca pourrait faire la job.....   a part ça je vois pas très rapidement.....

Work around c'est anglais, en gros c'est une manière d'éviter des problèmes, en passant par des issues que tu ne serais pas sensé =/ un peu comme modifier la taille de la police que j'avais suggérer, c'est pas idéal mais ca pouvait fonctionner, pratiquement....

Bon courage pour le php, c'est pas si compliqué.....

Puis ca serait PAS MAL MIEUX de laisser tomber les maudits tableaux...... je déteste les tableaux =/ c'Est sensé être plus clair, mais ca mélange tlt, entk je parle pour moi....

Désolé de pas pouvoir t'en dire plus =/

Hors Ligne

#17 25-07-2006 19:40:23

stouille
Membre
Lieu : Paris
Inscription : 06-07-2006
Messages : 78

Re : Menu en images.

salut.
J'ai suivi d'un peu loin ton problème, et je ne suis pas sur d'avoir compris celui ci (du moins le dernier big_smile).
Je pense que tu aimerai bien que les deux sous menus correspondants a "college" et "capes" s'affichent devant respectivement college et capes ?

Si c'est le cas, j'ai essayé et voici ce que j'obtiens !!

Ce qui posait problème en ce qui concernait les bandes blanches s'était les liens. Mais puisque toi tu préfère les images, pourquoi ne pas mettre les liens directement dans les images. Ensuite, pour info tes alt ne marcheront pas sur firefox, utilise plutot les "title" .
Bref voici la partie de code correspondant a ton menu :

<div id="menu">
<ul class="niveau1">
	<li class="sousmenu"><IMG SRC="images_p/menu/flamme_menu_010.jpg" border="0" WIDTH="98" HEIGHT="30" alt="Cours de colège" vspace="-2">
		<ul class="niveau2">
		<li><IMG SRC="images_p/menu/flamme_menu_020.jpg" border="0" WIDTH="98" HEIGHT="30" alt="Cours de sixième" hspace="0" vspace="-2" onclick="window.open('index.php?page=page&id_page=1');"></li>
		<li><IMG SRC="images_p/menu/flamme_menu_021.jpg" border="0" WIDTH="98" HEIGHT="30" alt="Cours de cinquième" hspace="0" vspace="-2" onclick="window.open('index.php?page=page&id_page=2');"></A></li>
		<li><IMG SRC="images_p/menu/flamme_menu_022.jpg" border="0" WIDTH="98" HEIGHT="30" alt="Cours de quatrième" hspace="0" vspace="-2" onclick="window.open('index.php?page=page&id_page=3');"></A></li>
		<li><IMG SRC="images_p/menu/flamme_menu_023.jpg" border="0" WIDTH="98" HEIGHT="30" alt="IDD" hspace="0" vspace="-2"></A></li>
		</ul>
	</li>	
	
	<li><IMG SRC="images_p/menu/flamme_menu_011.jpg" border="0" WIDTH="98" HEIGHT="30" alt="Exercices interactifs" hspace="0" vspace="-2"  onclick="window.open('index.php?page=page&id_page=4');"></li>
	<li class="sousmenu"><IMG SRC="images_p/menu/flamme_menu_012.jpg" border="0" WIDTH="98" HEIGHT="30" alt="CAPES">
		<ul class="niveau2" id="essai">
		<li><IMG SRC="images_p/menu/flamme_menu_030.jpg" border="0" WIDTH="98" HEIGHT="30" alt="Leçons de CAPES" onclick="window.open('index.php?page=page&id_page=8');"></li>
		<li><IMG SRC="images_p/menu/flamme_menu_031.jpg" border="0" WIDTH="98" HEIGHT="30" alt="programme TI" onclick="window.open('index.php?page=page&id_page=9');"></li>
		</ul>
	</li>

	<li><IMG SRC="images_p/menu/flamme_menu_013.jpg" border="0" WIDTH="98" HEIGHT="30" alt="Forum" onclick="window.open('http://sylvain.etienne1.free.fr/phpBB/');"  target="_blank"></li>
	<li><IMG SRC="images_p/menu/flamme_menu_014.jpg" border="0" WIDTH="98" HEIGHT="30" alt="Livre d'or" onclick="window.open('http://sylvain.etienne1.free.fr/alex_guestbook3/');"  target="_blank"></li>
	<li><IMG SRC="images_p/menu/flamme_menu_015.jpg" border="0" WIDTH="98" HEIGHT="30" alt="Origami" onclick="window.open('index.php?page=page&id_page=10');"></li>
</ul>
</div>

Le css reste quasiment inchangé, a part ceci a rajouté (pour les images)

img{
cursor:pointer;
margin-bottom:-6px;
}

Dis moi si cela te convient wink

Hors Ligne

#18 25-07-2006 21:18:04

ItIsHardToProgram
Membre
Inscription : 09-06-2006
Messages : 118

Re : Menu en images.

AH lalala stouille, tu sais comment c'est les profs, ils donnent jamais rien tout cru dans le bec, alors pourquoi le faire pour eux!!! big_smile

Hors Ligne

#19 25-07-2006 23:50:27

Billyboylindien
Membre d'honneur
Inscription : 06-10-2005
Messages : 1 561
Site Web

Re : Menu en images.

Pour ce qui est des dimmension d'affichage, il y a un plugin firefox (mais encor il faut l'utiliser), sinon je n'en connais pas d'autre.

Pour ce qui est d'apprendre le php, tetre que je ou un convive ferais un bon tuto big_smile

++


Les cartes wifi recommandée et testées
Billyboylindien parle d'informatique (un peu wink ).

Proposez vous aussi vos tutos sur tout les sujets (web, prog, bricolage ...)

Hors Ligne

#20 26-07-2006 00:59:07

sly_31415
Membre
Inscription : 23-07-2006
Messages : 10

Re : Menu en images.

Merci pour proposer de nouvelles voies.
J'ai testé avec le "onclick", c'est vrai que je n'y avais pas pensé (hum, sans commentaires). Cependant, après un certain temps de test, je ne parviens pas à supprimer la bande blanche sous les menus donnant des sous-menus (si vous m'avez suivi). Du coup, le problème est autre !
Le " margin-bottom:-6px" est une bonne idée (-3 est suffisant) et il faudrait faire une distinction entre IE et Firefox (car ça devient très moche chez ce dernier).

Je pense que tu aimerai bien que les deux sous menus correspondants a "college" et "capes" s'affichent devant respectivement college et capes ?

Non, justement, je souhaiterais que, par exemple devant collège, le sous menu affiche cinquième en face (donc le deuxième item) et Leçons pour le menu CAPES (donc le premier item).

Pour ceux qui disent que je n'ai rien fait big_smile, voici la syntaxe exacte afin d'avoir la fenêtre dans la même page :

onclick="window.open('index.php?page=page&id_page=1', '_self');"

Et donc remplacer _self par _blank pour l'avoir dans une fenêtre différente.

Et j'ai placé des titles de partout (je crois)...

Bon, je continuerai à réfléchir au problème tout à l'heure, la nuit portant conseil...

@ bientôt.

Hors Ligne

#21 26-07-2006 07:49:21

stouille
Membre
Lieu : Paris
Inscription : 06-07-2006
Messages : 78

Re : Menu en images.

Billyboylindien a écrit :

Pour ce qui est d'apprendre le php, tetre que je ou un convive ferais un bon tuto big_smile
++

javascript:insert_text(':lol:', '');

Le problème c'est qu'il est difficile de faire un tuto sur le php, par ou commencer ??
Ce qu'il faudrait c'est des lignes directrices. Sinon je veux bien m'y coller !

PS : Si des gens sont interessés par un tuto en php particulier qu'ils me le fasse savoir ! big_smile

PS 2 : le problème de sly_31415 n'est pas trop un problème php, mais plutot un melange de problème html + css.
De plus, mettre le nez dans php Gest'Classe c'est assez hard !!

Hors Ligne

#22 26-07-2006 07:53:48

stouille
Membre
Lieu : Paris
Inscription : 06-07-2006
Messages : 78

Re : Menu en images.

sly_31415 a écrit :

Du coup, le problème est autre !
Le " margin-bottom:-6px" est une bonne idée (-3 est suffisant) et il faudrait faire une distinction entre IE et Firefox (car ça devient très moche chez ce dernier).

pour faire la distinction entre un navigateur w3c (type mozilla) et IE dans un CSS, il faut rajouter un "_" devant l'attribut de ton choix.

Par exemple, pour ton problème voici comment faire :

img
    {
    cursor:pointer;
    margin-bottom:-6px;
    _margin-bottom:0px;
    }

Mozilla va prendre en compte uniquement ce qui n'a pas de "_", tandis que IE est le seul a prendre en compte
le _margin-bottom:0px;

Pour ton menu, pour CAPES ca a l'air d'être bon, par contre pour college, il suffit de modifier la class du ul

<ul class="[b][i]niveau_perso[/i][/b]">
        <li><IMG SRC="images_p/menu/flamme_menu_020.jpg" border="0" WIDTH="95" HEIGHT="30" alt="Cours de sixième" title="Cours de sixième" onclick="window.open('index.php?page=page&id_page=1', '_self');"></li>
        <li><IMG SRC="images_p/menu/flamme_menu_021.jpg" border="0" WIDTH="95" HEIGHT="30" alt="Cours de cinquième" title="Cours de cinquième" onclick="window.open('index.php?page=page&id_page=2', '_self');"></li>
        <li><IMG SRC="images_p/menu/flamme_menu_022.jpg" border="0" WIDTH="95" HEIGHT="30" alt="Cours de quatrième" title="Cours de quatrième" onclick="window.open('index.php?page=page&id_page=3', '_self');"></li>
        <li><IMG SRC="images_p/menu/flamme_menu_023.jpg" border="0" WIDTH="95" HEIGHT="30" alt="IDD" title="IDD" onclick="window.open('index.php?page=page&id_page=7', '_self');"></li>
        </ul>

contenant les cours de 6, 5 etc ... et de modifier le css correspondant en modifiant le margin-top.

body {behavior: url(csshover.htc);}
img { display: block; cursor:pointer; margin-bottom:-3px;}
div#menu {width: 95px;}
div#menu ul {padding: 0; width: 95px; border:0px; margin:0px;}
div#menu li.sousmenu {background: black; height:30px; border-bottom:0px; padding: 0;}
div#menu ul li {position:relative; list-style: none; border-bottom:0px;}
div#menu ul ul {position: absolute; top: 0; left: 95px; display:none}
div#menu li a {text-decoration: none;}
div#menu ul.niveau1 li.sousmenu:hover ul.niveau2, 
div#menu ul.niveau2 li.sousmenu:hover ul.niveau3 {display:block;} 

.niveau_perso{
display:block;
margin-top:-10px;
}

Désolé je ne peux pas tester ce que ca donne, dis moi si ca marche !!
wink

Dernière modification par stouille (26-07-2006 08:04:34)

Hors Ligne

#23 27-07-2006 16:25:23

sly_31415
Membre
Inscription : 23-07-2006
Messages : 10

Re : Menu en images.

Youpi !
Avec ton aide précieuse (et un peu de trifouillage), j'ai réussi.
Voici le code CSS :

body {behavior: url(csshover.htc);}
div#menu img {display: block; cursor:pointer; margin-bottom:0px; _margin-bottom:-3px;}
div#menu {width: 95px;}
div#menu ul {padding: 0px; border:0px; margin:0px none; font-size: 1px; line-height:1px;}
div#menu li.sousmenu {height:30px; border-bottom:0px; padding: 0;}
div#menu ul li {position:relative; list-style: none; border-bottom:0px;}
div#menu ul ul { position: absolute; top: 0; left: 95px; display:none}
div#menu li a {text-decoration: none;}
div#menu ul.niveau1 li.sousmenu:hover ul.niveau2, 
div#menu ul.niveau2 li.sousmenu:hover ul.niveau3 {display:block;} 
div#menu ul.niveau1 li.sousmenu:hover ul.niveauperso {display:block; margin-top:-20px;}

C'était le premier ul qui posait problème et en utilisant font-size: 1px; line-height:1px; il n'y a plus de bandes entre les images.

pour faire la distinction entre un navigateur w3c (type mozilla) et IE dans un CSS, il faut rajouter un "_" devant l'attribut de ton choix.

En effet cela marche bien, et moi, je suis ^_^ ou big_smile.

Je viens de faire un essai en remplaçant :

div#menu img {display: block; cursor:pointer; margin-bottom:0px; _margin-bottom:-3px;}

par

div#menu img {display: block; cursor:pointer; font-size: 1px; line-height:1px;}

Et ça marche de la même façon, je pense que ça doit être un peu plus propre, mais je retiendrais le underscore.

Je pense avoir appris bien plus en 3 jours sur le CSS ici qu'en trois mois tout seul..., donc merci bien.

Ne vous inquiter pas, je reviendrais vous embêter de temps à autre (une histoire d'intégration du menu dans les différentes pages de Gest'Classe, un petit truc avec phpmychat et l'été n'est pas fini tongue).

Bon, je vais me plonger dans le code pour l'intégration du menu.
@+.

P.S. : pour un tutoriel sur le php, il est vrai que c'est assez difficile de faire quelque chose de bien et d'un peu original (il existe une documentation officielle que j'ai (ouvert une fois)). Peut-être que le tutoriel serait de faire un script utile (genre un chat roll) et de rajouter des fonctionnalités par petites touches pour voir les possibilités du php.

EDIT : Je ne parviens pas à changer le sujet pour mettre [Réglé] devant...

Dernière modification par sly_31415 (27-07-2006 16:46:45)

Hors Ligne

#24 28-07-2006 10:58:28

stouille
Membre
Lieu : Paris
Inscription : 06-07-2006
Messages : 78

Re : Menu en images.

sly_31415 a écrit :

Peut-être que le tutoriel serait de faire un script utile (genre un chat roll) et de rajouter des fonctionnalités par petites touches pour voir les possibilités du php.

Je vais voir ce que je peux faire lol

Hors Ligne

Annonce

Visitez la boutique Wifi-highpower.com, votre revendeur agréé Alfa Network: du matériel Wifi sélectionné, cartes Wifi USB Awus036h et Awus036nh, antennes omnis, yagis, panel, amplis wifi, accessoires...

Sujets similaires

Discussion Réponses Vues Dernier message
1 3067 14-01-2012 23:41:51 par Ririna
0 4011 08-01-2011 05:59:59 par koni41
2 2877 11-06-2010 18:56:24 par metis15
1 3756 04-05-2010 15:24:59 par klipper
0 3448 06-09-2009 02:19:03 par arsouille