> Tous les forums > Forum des Webmasters
 La vengeance des menus déroulants
Ajouter un message à la discussion
Pages : [1] 2 ... Fin
Page 1 sur 2 [Fin]
albatros
  Posté le 10/06/2009 @ 19:26 
Aller en bas de la page 
Petite astucienne

Bonjour,

Bien entendu je fais de mon mieux pour apprendre mais là je m’embrouille un peu ......mon petit neurone de blonde en prend pour son grade !!!
J’ai donc besoin de votre aide.

Le but du jeu pour moi est « simplement » de modifier l’apparence d’un site de chercheurs (des gens pas très sexy) qui techniquement fonctionne très bien….disons que le côté design n’est pas franchement la tasse de thé du webmaster.

Je souhaite pouvoir lui faire différentes présentations.
Je travaille sur dreamweaver.

Je comprends le principe de relation page .html et .css je fais joujou avec et j'apprends.

Mon premier problème :
Je parviens à placer mon menu déroulant (on est content...enfin surtout moi ! ) mais je n'arrive pas a adapter des sous menus

mon code est celui-ci :

<div id="tabsH">

<ul>

<li id="current"><a href="Accueil.html"><span>Accueil</span></a></li>

<li><a href="Les recherches.html"><span>Les recherches</span></a></li>

<li><a href="Déposer un projet<.html"><span>Déposer un projet</span></a></li>

<li><a href="formulaires.html"><span>Les formulaires</span></a></li>

<li><a href="Historique.html"><span>Historique</span></a></li>

<li><a href="Membres.html"><span>Membres</span></a></li>

<li><a href="Liens.html"><span>Liens</span></a></li>

</ul>

</div>

Mon.css est celui là :

/*- Menu Tabs H--------------------------- */

#tabsH {

float:left;

width:100%;

background:#000;

font-size:98%;

line-height:normal;

}

#tabsH ul {

margin:0;

padding:30px 10px 0 240px;

list-style:none;

}

#tabsH li {

display:inline;

margin:0;

padding:0;

}

#tabsH a {

float:left;

margin:0;

padding:0 0 0 4px;

text-decoration:none;

background-image: url(tableftH.gif);

background-repeat: no-repeat;

background-position: left top;

}

#tabsH a span {

float:left;

display:block;

padding:5px 15px 4px 6px;

color:#FFF;

background-image: url(tabrightH.gif);

background-repeat: no-repeat;

background-position: right top;

}

/* Commented Backslash Hack hides rule from IE5-Mac \*/

#tabsH a span {float:none;}

/* End IE5-Mac hack */

#tabsH a:hover span {

color:#FFF;

}

#tabsH a:hover {

background-position:0% -42px;

}

#tabsH a:hover span {

background-position:100% -42px;

}

#tabsH #current a {

background-position:0% -42px;

}

#tabsH #current a span {

background-position:100% -42px;

}

Le résultat de ma page pour l’instant : http://www.andja.ch/index.html

Sur les images en vertical aussi j’aimerai faire des menus déroulants mais c’est une autre étape, il faudrait déjà que je maitrise les plus basic, parce qu'un menu sur une image je pense que je joue déjà dans la cours des grands !!

Mon autre souci du jour c’est le logo « Resar » je ne suis pas autorisée à le modifier, je l'ai donc intégré dans ma barre de menus, mais le placer de cette façon ..finalement....est-ce bien raisonnable ? ?

body {

margin:0;

padding:0;

font: bold 11px/1.5em Verdana;

position: absolute;

}


#logo {

position:absolute;

left:-4px;

top:17px;

width:143px;

height:109px;

z-index:1;

}

Je me demande s’il va rester à sa place ?
Est-ce qu’en ajoutant des codes par la suite je ne risque pas de le voir partir à Tokyo subitement ?
Il y a-t-il une façon plus judicieuse de faire cela ?

Voilà (pour l’instant) mes petits soucis

Sorry to be so nouille



Modifié par albatros le 10/06/2009 19:28
Publicité
elle
 Posté le 10/06/2009 à 19:36 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grande Maîtresse astucienne

Un instant, j'ai pensé que tu étais du Québec. Je ne savais pas que nouille était aussi utilisé dans ce sens ailleurs.

Tu as plusieurs modèles de menus déroulants imbriqués ici : http://www.cssplay.co.uk/menus/

Tu pourrais t'en inspirer...

Dreamer
 Posté le 10/06/2009 à 19:48 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Maître astucien

Salut

Petit truc en passant : pas de majuscules , ni d'accents , ni morceaux de balise sur les liens ........

Exemple : poser<.html et Styles_perso.css

Pas de <style type="text/css"> </style> tout seul , il n'y a rien au milieu !!!

albatros
 Posté le 10/06/2009 à 20:44 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne

Salut elle, je suis Suissesse (surtout ne va pas trop l'ébruiter y'a pas de quoi être très fière vu l'actualité de ces derniers temps ici)

c'est peut-être plus utilisé chez nous le terme "nouille"

Merci pour le lien j'avais déjà été pêcher dans ces eaux là, mais rien à faire je n'arrive pas a adapter les sous menus à mes menus à moi.

Je me retrouve avec des menus et sous menus tout déplacés décalés....un truc pas présentable du tout !

merci Dreamer, je tente souvent de suivre tes explications qui sont toujours très pertinentes.

Je n'ai pas encore l'automatisme de faire attention aux accents et aux majuscules mais je vais me le répéter 82 fois d'ici demain.

griggione
 Posté le 11/06/2009 à 07:08 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grand Maître astucien

Bonjour albatros

Tout d'abord rectifie ce que dit Dreamer, puisque tu as déja une feuille de style en racine: stylesperso.css

Pourquoi ces hacks dans ta feuille, tu peux trés bien faire tes menus déroulant en CSS pour tous navigateurs.

Ta feuille xHTML, pourquoi ne pas mettre un header, un corps de page et un footer, regarde, tu positionnes d'abord ton menu avec photos en premier, puis ton menu horizontal en second, l'inverse serait plus logique.

Tu peux trés bien mettre un menu déroulant sur une photo, c'est un background comme un autre.

Le logo, direct sur fond noir, c'est triste et on voit mal par exemple, l'accent en gris.

Jette un coup d'oeil sur ces modestes menus tout en CSS par un clic droit > code source:

http://www.griggione.fr/



Modifié par griggione le 11/06/2009 07:38
albatros
 Posté le 11/06/2009 à 20:57 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne

Bonsoir griggione,

Désolée de répondre si tard mais c'était une journée de ouf chez moi !

Je fais mes premiers pas dans ce domaine, autant te dire que cette phrase là "Pourquoi ces hacks" ....je ne sais même pas ce qu'elle veut dire c'est quoi des hacks ????

Tu sais ce que je cherche ce n'est pas comment doit être présenté le site, c'est un site de chercheurs d'un reseau d'études appliquées je ne peux pas me permettre trop de fantaisies avec eux !

Je dois resté dans le sobre, donc je vais faire 4 ou 5 présentations et ils choisiront ce qu'ils veulent, si c'était mon site je ne le ferai pas ainsi mais je dois suivre certaines directives.

Donc mon problème n'est pas pour l'instant l'apparence mais comment appliquer les fonctions !!??? Comment faire ces fichus sous menus sur ces boutons là !

Bon aujourd'hui même pas eu le temps de mettre mon nez dessus j'avoue...je vais y passer les 3 prochains jours.

Bonne soirée

griggione
 Posté le 12/06/2009 à 06:17 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grand Maître astucien

RE

Ben justement, ce qui est écrit avant est pour simplifier tes mises en pages.

/* Commented Backslash Hack hides rule from IE5-Mac \*/

#tabsH a span {float:none;}

/* End IE5-Mac hack */

#tabsH a:hover span {

color:#FFF;

}

Les hacks sont des codes de bidouillage pour s'adapter à IE5 et + et Mac...... mais qui passent pas aux normes internationales.

Heureusement, il y a d'autre possibilités qui passent, au plus en cas de feuille de style + html un peu complexe, tu peux te servir éventuellement de Commentaires Conditionnels.

Donc pour rester sobre et faire disons 1 proposition concrète, commence par lire et appliquer les conseils donnés avant.
1-construire ta page xhtml logiquement, header, colonne, corps, footer
2-refaire ta feuille de style adaptée à ta page

Et la oui, tu pourra faire diverses propositions puisque tu maitrises la 1ere.

albatros
 Posté le 12/06/2009 à 08:14 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne

Merci griggione.

Ok pour l'explication des hacks, de ce côté là c'est le webmaster qui adaptera à sa façon, c'est un pro.... me fais pas de soucis sur ce genre de choses là. mais bon c'est toujours intéressant a savoir je te rermercie.

En ce qui concerne :

1-construire ta page xhtml logiquement, header, colonne, corps, footer
2-refaire ta feuille de style adaptée à ta page

ça m'avance pas du tout hein !

Oui, je vais arriver a faire différents header, colonnes, paragraphes et autres positionnements, il y a des 100 ènes de tutos et je parviens a appliquer le principe ! mais pour l'instant c'est pas mon problème.

mon problème c'est toujours le même je n'arrive pas a faire mes sous-menus adapté à-mon-menu-a-moi et pas un autre !

...en même temps à la base c'était ma seule question comment faire mes sous-menus, le reste je vais me débrouiller !

il est ou mon pca des années 2000-2004 ?...Polo au secours !{#}




Modifié par albatros le 12/06/2009 08:16
elle
 Posté le 12/06/2009 à 08:27 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grande Maîtresse astucienne

Ben déjà, si on pouvait le voir, ce fameux menu...

Et le principe des sous-menus est bien démontré dans le site que j'ai cité plus haut.



Modifié par elle le 12/06/2009 08:29
griggione
 Posté le 12/06/2009 à 08:28 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grand Maître astucien

RE

De deux chose l'une, ou tu dois arranger ce site, tes menus compris, et dans ce cas c'est toi qui fait office de webmaster, ou tu as un webmaster et c'est lui qui corrige.

Si vous êtes à deux dessus et que chacun fait sa méthode, bonjour l'angoisse.

En plus, comme vérifier tes menus, tu as désactivé ton lien, on avance comme ça.

elle
 Posté le 12/06/2009 à 08:33 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grande Maîtresse astucienne

griggione a écrit :

En plus, comme vérifier tes menus, tu as désactivé ton lien, on avance comme ça.

Trop tard!

griggione
 Posté le 12/06/2009 à 08:35 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grand Maître astucien

RE

Ca fait deux fois .......

albatros
 Posté le 12/06/2009 à 08:49 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne

J'ai pas désactivé mon lien c'est mon hebergeur qui me fait un caca nerveux...merci infomaniak c'est exactement le moment ! {#}

De deux chose l'une

L'autre c'est le soleil...excuse je ne peux jamais m'empêcher !

Non griggione on ne s'emmêle pas les pinceaux avec le webmaster vraiment pas, c'est que du bonheur de travailler avec ce mec.On a une complémentarité sur plusieurs choses tout va bien.

Merci elle, ton lien et pleins d'autres expliquent très bien le "comment faire"...sauf que je n'arrive pas a l'appliquer sur mes menus ce principe là !

Mais bon, je ne sais pas comment vous le dire autrement ? j'ai toujours la même phrase qui revient c'est pénible et pour vous et pour moi.

En tout cas merci du temps passé a m'avoir donné des indications.



Modifié par albatros le 12/06/2009 09:01
griggione
 Posté le 12/06/2009 à 09:29 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grand Maître astucien

RE

Pour nous c'est pas pénible

Attendons de voir le site à nouveau, car avec les codes que tu as mis ici, c'est sur que tu n'as pas de déroulant, un menu oui, mais c'est tout.

albatros
 Posté le 13/06/2009 à 12:45 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne

Saluuuuuuuuuuuuuuut mon Polo adoré {#}{#}{#} qu'est-ce que ça fait du bien de voir un pseudo familier.

Ben pour le coup je me demande si c'est parce que je suis de plus en plus blonde, ou parce que j'ai de moins en moins 18 ans que je mets si longtemps a comprendre !

Ils sont adorablent ils me donnent des liens, des tutos, etc....mais bon en même temps ça je les trouve toute seule, je sais faire !

Ce que je voulais c'est que quelqu'un puisse placer les codes des sous-menus dans mon code que j'aii laissé au dessus, pour que ça me permette enfin de comprendre ce que je fais comme nouillerie ! et pourquoi ça marche pas chez moi !

C'est marrant quand même que quand tu fais un s.o.s on te donne des tutos à suivre ! ....Si t'appel au secours c'est que t'arrive pas à le faire ...sinon t'appel pas hein !... forcément !

C'est moi qui ai changé ou c'est pca ???

J'en sais rien ?{#}

Bon évidement faut que je fasse deux trois manip. chez mon hebergeur pour réactiver l'affichage mais là j'ai pas le temps je verrai demain.

C'est un vrai plaisir pour moi de te revoir mon Polo {#} parfois j'ai une grande nostalgie de notre "avant"

Bisousssss

elle
 Posté le 13/06/2009 à 17:18 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grande Maîtresse astucienne

Je ne comprends pas ce que tu veux de plus : comme griggione te l'a dit, tu as mis un code de menu, pas de menu déroulant. Examine les codes de menus déroulants donnés en exemple et refais le tiens sur cette base.

Maintenant, si tu veux que quelqu'un te crée ton menu, ce qui n'est pas possible sans modifier le code du menu auquel tu tiens tant, c'est autre chose.



Modifié par elle le 13/06/2009 17:19
Soutenez PC Astuces

PC Astuces a besoin de vous pour survivre. Nos conseils et astuces vous ont aidé ? Vous avez résolu un problème sur votre ordinateur ? Vous avez profité de nos bons plans ? Aidez-nous en retour avec un abonnement de soutien mensuel.


5 € par mois 10 € par mois 20 € par mois


Gérer son abonnement

Dreamer
 Posté le 13/06/2009 à 17:29 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Maître astucien

Salut

On voudrait bien aider , mais sans la page , sans script c'est dur !!!

Dreamer
 Posté le 13/06/2009 à 18:01 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Maître astucien

polo a écrit :

salut Dreamer


mais voyons tu as fait fonctionner ta boule de cristal

ou demander a "elle" qui se balade nue avec de tres bons yeux et qui sait tjs tout

J'ai oublié mes bésicles !!!

griggione
 Posté le 13/06/2009 à 21:00 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grand Maître astucien
albatros a écrit :

Ils sont adorablent ils me donnent des liens, des tutos, etc....mais bon en même temps ça je les trouve toute seule, je sais faire !

C'est marrant quand même que quand tu fais un s.o.s on te donne des tutos à suivre ! ....Si t'appel au secours c'est que t'arrive pas à le faire ...sinon t'appel pas hein !... forcément !


RE

Il me semble bien ne pas avoir de lien (sauf exemple) mais plutot essayé de te faire comprendre que tes codes ne sont pas actuellement comme il faut pour ta demande.

griggione a écrit :

Tout d'abord rectifie ce que dit Dreamer, puisque tu as déja une feuille de style en racine: stylesperso.css

Pourquoi ces hacks dans ta feuille, tu peux trés bien faire tes menus déroulant en CSS pour tous navigateurs.

Ta feuille xHTML, pourquoi ne pas mettre un header, un corps de page et un footer, regarde, tu positionnes d'abord ton menu avec photos en premier, puis ton menu horizontal en second, l'inverse serait plus logique.

As-tu au moins essayé de modifier
As-tu lu comme dit et comme le souligne elle, que ton code actuel ne comprend aucun sous-menu, ........

griggione a écrit :

Attendons de voir le site à nouveau, car avec les codes que tu as mis ici, c'est sur que tu n'as pas de déroulant, un menu oui, mais c'est tout.

albatros
 Posté le 13/06/2009 à 22:10 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne

Que personne ne sorte !

on me dit :

- "ton code actuel ne comprend aucun sous-menus"

- As-tu lu comme dit et comme le souligne elle, que ton code actuel ne comprend aucun sous-menu

c'est une histoire de fou ou quoi !?

le truc c'est que mon code menu n'est pas déroulant forcément....puisqu'il n'a pas de sous-menus (par définition )

et que je cherche comment faire des sous-menus et savoir ce que je dois modifier dans mon code

Ma page est a nouveau active

http://www.andja.ch/index.html

les images qui constituent le menu sont :

left

right

le logo

et ici :

mon fichier.css

je dois le renommer, Dream je n'oublie pas la leçon


il n'y a pas d'urgence bien évidement, merci pour votre aide



Modifié par albatros le 13/06/2009 22:14
elle
 Posté le 13/06/2009 à 22:18 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grande Maîtresse astucienne

Qu'est-ce qui t'empêche de prendre un modèle de code de menu déroulant qui fonctionne, de le paramétrer à ton goût et d'y insérer tes images?

albatros
 Posté le 13/06/2009 à 22:25 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne

J'avais tenté deux ou trois fois d'inverser la procédure effectivement elle...mais c'est assez cata j'ai pleins de décalage

de grandeur.....ça c'est le manque de connaissances dans ce domaine, c'est pour ça que je demande de l'aide.

griggione
 Posté le 14/06/2009 à 10:44 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grand Maître astucien
albatros a écrit :

...mais c'est assez cata j'ai pleins de décalage de grandeur.....

RE

C'est bien ce qu'on te dit, commence par mettre de l'ordre dans tes fichiers Xhtml et CSS, car sinon ce que tu vas rajouter sera toujours avec des problèmes

Regarde déja, on te dit que tu as des balises inutiles et tu laisses comme ça:

<style type="text/css">

</style>

Ensuite si tu veux de l'aide et que tu as corrigé, ben comme proposé plusieurs fois, choisis un sous-menu qui te convient, fais des éssais et revient avec tes codes et là ou tu bloques.

Mais, je sais je radote, commence par rectifier tes fichiers actuels.


albatros
 Posté le 14/06/2009 à 12:28 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne

Tu confonds probablement les gens qui ont déjà une bonne base et n'ont besoin que de quelques conseils, et ceux qui débutent, qui demande juste qu'on leur modifie le fichier tel qu'il devrait être afin de comprendre et apprendre ces bases.

Sur ma page c'est mon premier fichier non modifié parce que les essais que j'ai fait pour corriger ne fonctionne pas ! (et qu'on me demandait de réactiver cette page pour voir les codes.) je dois juste enlever ce =text/css

choisis un sous-menu qui te convient, fais des éssais et revient avec tes codes et là ou tu bloques.

Si j'y arrivais je ne serais pas là à demander de l'aide !

ce serait assez grave de demander de l'aide sur un truc qu'on sait faire non...me semble.....mais bon !

albatros
 Posté le 14/06/2009 à 12:38 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne

Si y'en a un seul qui me dit encore une fois "T'as qu'a faire tes sous-menus" je lui mords l'oreille droite {#}

albatros
 Posté le 14/06/2009 à 13:04 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne

oui Polo parce que j'ai pas changé mon premier fichier chez mon hebergeur j'ai déjà dû batailler avec lui ces deux derniers jours.

Je modifie plus tard.

Tu veux que je te morde l'oreille toi ?

Dreamer
 Posté le 14/06/2009 à 13:28 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Maître astucien

polo a écrit :

salut albatros


je remarque que tu suis pas ce que l'on te dit

deja commence par me vire ces 2 lignes

juste avant ton

de plus tu as meme pas commencer tes sous menu

sans penser que tu n'as meme pas mi les pages :
Accueil.html
Les recherches.html
Déposer un projet<.html = la erreur faut retirer le <
etc...
en ligne

Peut-être qu'elle t'écoutera ??

albatros
 Posté le 14/06/2009 à 13:38 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne

Ok laissez tomber mes petits chatons je vais me débrouiller autrement

merci de votre aide



Modifié par albatros le 14/06/2009 13:39
tirikou
 Posté le 14/06/2009 à 13:41 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Astucien

Bonjour,

Voici un tuto de départ qui permet de faire sans problème un menu horizontal déroulant.

http://css.developpez.com/tutoriels/menu-deroulant/

Une fois ce menu fait, tu pourras poster ici les problèmes que tu rencontres.

C'est bien plus facile pour nous de plancher sur un problème spécifique.

Et là c'est un autre tuto complémentaire pour aborder la compatibilité avec IE entre autre (application du :hover).

http://www.tuto-fr.com/tutoriaux/tutorial-menu-deroulant-css.php

Déjà, voici de quoi réaliser ce que tu demandes. Ensuite nous pourrons t'aider à l'adapter (entre autre avec le logo) mais ce ne sera pas la difficulté.

Bon dimanche ...

griggione
 Posté le 14/06/2009 à 14:47 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grand Maître astucien
albatros a écrit :

Ok laissez tomber mes petits chatons je vais me débrouiller autrement

RE

On a bien compris que tu t'es avancée pour faire une mise en page de site sans les connaissances, mais faut pas non plus croire que dans un forum technique tu trouveras tout.

tirikou a écrit :

Une fois ce menu fait, tu pourras poster ici les problèmes que tu rencontres.

C'est bien plus facile pour nous de plancher sur un problème spécifique.

D'abord c'est vrai que c'est plus facile et puis surtout s'il y a aide c'est sur des difficultés, par pour faire tout le travail.
Comme dit avant il y a des centaines d'exemples sur la toile.

Ensuite suis les conseils mais fait aussi attention.
Par exemple, tu as enlevé les lignes citées mais pour en mettre d'autres, cela devait te choquer, et là oui voila de l'aide que tu auras:

<title>Accueil</title>
<link href="Styles_perso.css" rel="stylesheet" type="text/css" /></style>
<link href="stylesperso.css" rel="stylesheet" type="text/css" />
</head>

tirikou
 Posté le 14/06/2009 à 14:51 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Astucien

Re,

C qu'il te faut comprendre pou développer ton menu ne serait-ce qu'au nivau du html c'est l'imbrication des balises et leur niveau :

Ton menu est contenu dans un div

<div id="menu">

</div>

Ensuite, ton premier niveau est contenu dans des ul

<div id="menu">

<ul class="niveau_1">

</ul>

</div>

Tes liens de premier niveau sont donc à ce niveau là dans les li

<div id="menu">

<ul class="niveau_1">

<li><a href="">Accueil</a></li>

<li><a href="">Recherche</a></li>

<li><a href="">Projet</a></li>

.....

</ul>

</div>

Tes liens de second niveau doivent aussi être contenus dans des ul puis des li

<div id="menu">

<ul class="niveau_1">

<li><a href="">Accueil</a></li>

<ul class="niveau_2">

<li><a href="">Accueil 1</a></li>

<li><a href="">Accueil 2</a></li>

<li><a href="">Accueil 3</a></li>

</ul>

<li><a href="">Les Recherches</a></li>

<ul class="niveau_2">

<li><a href="">Recherche 1</a></li>

<li><a href="">Recherche 2</a></li>

<li><a href="">Recherche 3</a></li>

</ul>

</ul>

</div>

Donc, à chaque fois que tu veux rajouter un onglet et ses sous menus il faut rajouter ceci :

<li><a href="">Onglet</a></li>

<ul class="niveau_2">

<li><a href="">sous menu 1</a></li>

<li><a href="">sous menu 2</a></li>

<li><a href="">sous menu 3</a></li>

</ul>

J'essaie d'être le + clair possible, mais l'indentation sur ce forum étant tellement galère que c'est difficile d'écrire du code lisiblement.

Je te conseille d'abord de faire ton menu pour qu'il fonctionne, ensuite tu pourras l'intégrer dans ton site.

As tu compris cette première partie avant d'aller voir ce qu'il se passe en css ?

griggione
 Posté le 14/06/2009 à 14:59 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grand Maître astucien
tirikou a écrit :

J'essaie d'être le + clair possible, mais l'indentation sur ce forum étant tellement galère que c'est difficile d'écrire du code lisiblement.

RE

Mais pourquoi la team a mis cet éditeur de message de m.... en javascript.
Je suppose pour que ce soit plus facile pour tous.


Ca décourage de répondre, surtout avec des codes, sans compter maintenant ces fenetres de copier/coller, etc.....

albatros
 Posté le 14/06/2009 à 15:08 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne

On a bien compris que tu t'es avancée pour faire une mise en page de site sans les connaissances, mais faut pas non plus croire que dans un forum technique tu trouveras tout.

non, c'est juste une propositon de design et pas une gestion de site c'est pas mon job.

Par exemple, tu as enlevé les lignes citées mais pour en mettre d'autres, cela devait te choquer, et là oui voila de l'aide que tu auras:

oui t'a raison ça m'a choquée sur dream il m'a souligné toute la 1ère partie en rouge {#}

je vais réctifier avec ton code.

tirikou

les code des sous menus c'est bon je sais bien comment les faire

mais regarde le résultat j'suis pas vraiement enchantée

griggione
 Posté le 14/06/2009 à 15:25 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grand Maître astucien

RE

Pense à remettre ton url de temps en temps pour suivre, ça évite de chercher

Bon tu as commencé, mais tu as oublié le principal, ton sous-menu accueil doit être dans ton menu accueil, pas en dehors, aprés le :

<li id="current"><a href="http://www.resar.ch/"><span>Accueilspan>a>li>

attention de déplacer la balise de fermeture

Oupppsssss l'url: http://www.andja.ch/index.html



Modifié par griggione le 14/06/2009 15:26
tirikou
 Posté le 14/06/2009 à 15:26 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Astucien

Je comprends que tu ne sois pas enchantée ....

Voici ton code :

<div id="tabsH">
<ul>

<li id="current"><a href="http://www.resar.ch/"><span>Accueil</span></a></li>
<li><a href="http://www.resar.ch/?page=249"><span>Les recherches</span></a></li>
<li><a href="http://www.resar.ch/?page=28"><span>Déposer un projet</span></a></li>
<li><a href="http://www.resar.ch/?page=282"><span>Les formulaires</span></a></li>
<li><a href="http://www.resar.ch/?page=11"><span>Membres</span></a></li>
<li><a href="http://www.resar.ch/?page=21"><span>Liens</span></a></li>

</ul>
</div>
<div id="menu">

<ul class="niveau_1">

<li><a href="">Accueil</a></li>

<ul class="niveau_2">

<li><a href="">Accueil 1</a></li>
<li><a href="">Accueil 2</a></li>

<li><a href="">Accueil 3</a></li>

</ul>

<li><a href="">Les Recherches</a></li>

<ul class="niveau_2">

<li><a href="">Recherche 1</a></li>

<li><a href="">Recherche 2</a></li>

<li><a href="">Recherche 3</a></li>

</ul>

</ul>

</div>

Et voici ce qu'il aurait fallut :

<div id="tabsH">

<ul class="niveau1">

<li><a href="">Acceuil 1</a></li>

<ul class="niveau2">

<li><a href="">Sous Accueil 1</a></li>

<li><a href="">Sous Accueil 2</a></li>

<li><a href="">Sous Accueil 3</a></li>

</ul>

<li><a href="">Les Recherches</a></li>

<ul class="niveau2">

<li><a href="">Sous Recherche 1</a></li>

<li><a href="">Sous Recherche 1</a></li>

<li><a href="">Sous Recherche 1</a></li>

</ul>

<li><a href="">Déposer un projet</a></li>

<ul class="niveau2">

<li><a href="">Sous projet 1</a></li>

<li><a href="">Sous projet 1</a></li>

<li><a href="">Sous projet 1</a></li>

</ul>

<li><a href="">Les formulaires</a></li>

</ul>

</div> // Fin de div tabsH

Il faut faire pareil avec les autres "têtes" de menu et leur sous menus.

Ensuite tu met cela à la place de ton menu existant (div tabsH).

Après il va falloir faire le Css (faire floater les ul, enlever les puces, masquer les sous menu, etc, etc.)

Et il y a tout dans le tuto.

Et de l'aide ici pour y aller step by step ...

Dreamer
 Posté le 14/06/2009 à 15:28 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Maître astucien

Re

J'ai fait un peu mumuse avec ton script et voilà le résultat fait un peu à l'arrache prouvant que c'est faisaible et à toi de l'adapter : http://www.pashmina-le-site.com/albatros/

Bon , j'ai pas eu le temps de tester sur IE !!

A+

griggione
 Posté le 14/06/2009 à 15:33 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grand Maître astucien

RE

IE7 et 8 ça passe, IE6 et 5.5 non, pas de sous-menus.

tirikou
 Posté le 14/06/2009 à 15:35 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Astucien

Pas de souci, dans le deuxième tuto donné il y a le fichier htc qui permet de faire fonctionnr sous IE.

griggione
 Posté le 14/06/2009 à 15:36 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grand Maître astucien

RE

Dreamer tu as essayé sans les commentaires conditionnels

griggione
 Posté le 14/06/2009 à 15:38 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
  Grand Maître astucien
tirikou a écrit :

Pas de souci, dans le deuxième tuto donné il y a le fichier htc qui permet de faire fonctionnr sous IE.

RE

Ha oui sous IE 6 au moins il le faut ce htc

albatros
 Posté le 14/06/2009 à 15:45 
Aller en bas de la page Revenir au message précédent Revenir en haut de la page
Petite astucienne

Vous êtes super merci bien

Pense à remettre ton url de temps en temps pour suivre, ça évite de chercher

Oui griggione j'y ai pensé mais plus tard

je vais corriger selon tes infos

ok tirikou je vais le faire mais un peu plus tard suis un chouilla débordée par encore d'autres "petits" impératifs de la vie de tous les jours

Dreamer moi j'aime bien quand tu fais joujou ça va me permettre de mieux comprendre étape par étape

Désolée pour les mal entendus du début de post.

je reviens vous dire quand j'aurai fait les améliorations (sans oublier de remettre le lien)

Pages : [1] 2 ... Fin
Page 1 sur 2 [Fin]

Vous devez être connecté pour participer à la discussion.
Cliquez ici pour vous identifier.

Vous n'avez pas de compte ? Créez-en un gratuitement !
Recevoir PC Astuces par e-mail


La Lettre quotidienne +226 000 inscrits
Avec l'actu, des logiciels, des applis, des astuces, des bons plans, ...

Les bonnes affaires
Une fois par semaine, un récap des meilleurs offres.

Les fonds d'écran
De jolies photos pour personnaliser votre bureau. Une fois par semaine.

Les nouveaux Bons Plans
Des notifications pour ne pas rater les bons plans publiés sur le site.

Les bons plans du moment PC Astuces

Tous les Bons Plans
Mini PC BMAX B9 Power (Core i9-12900H, 32 Go RAM DDR5, SSD NVMe 1 To, WiFi 6, BT 5.2, Windows 11)
459 € 599 € -23%
@Geekbuying
Assortiment d'outils d'ouverture et de levier iFixit (téléphone, tablette, ordinateur, etc)
9,95 € 19,95 € -50%
@Amazon
Vidéoprojecteur Lenovo Xiaoxin 100P (Full HD, 850 ANSI, Android)
199 € 250 € -20%
@Geekbuying
Mini PC BMAX B9 Plus (Intel Core i5-1250P, 24 Go RAM DDR5, SSD NVMe 512 Go, WiFi 6, BT 5.2, Windows 11)
329 € 449 € -27%
@Geekbuying
Pastilles lave-vaisselle Finish Ultimate 80 capsules
13,99 € 19,99 € -30%
@Amazon
Batterie externe ultra mince INIU Power Bank (10 000 mAh, PD 22.5W, LED)
10,99 € 22 € -50%
@Amazon

Sujets relatifs
Calculer 2 menus déroulants
recopie des menus déroulants sur toutes les pages
Menus deroulants ne fonctionnent pas sous IE
Boutons flash et menus déroulants sur Dreamweaver4
Menus non visibles
Sous-menus sous Webcreator Pro3
creer des sous-menus avec WebCreator Pro
Boutons interactifs et sous-menus Frontpage 2003
Problème en CSS avec les sous menus
Création des menus imbriqués
Plus de sujets relatifs à La vengeance des menus déroulants
 > Tous les forums > Forum Forum des Webmasters