Menu déroulant CSS perso

Fermé
Black_Winged_Angel Messages postés 299 Date d'inscription mardi 11 décembre 2007 Statut Membre Dernière intervention 22 novembre 2008 - 21 juin 2008 à 00:22
xavierh Messages postés 72 Date d'inscription mardi 3 juin 2008 Statut Membre Dernière intervention 9 août 2009 - 5 juil. 2008 à 20:24
Bonsoir, voila je vais faire simple, j'ai ceci:

Index.html
__________________________________________________________________
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>BlackWingedAngel.ifrance</title>
<link href="Style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="Header">
<ul id="Menu">
<li><a href="Index.html">Menu 1</a></li>
<li><a href="Index.html">Menu 2</a></li>
<li><a href="Index.html">Menu 3</a></li>
<li><a href="Index.html">Menu 4</a></li>
</ul>
<p><br />

</div></body>
</html>
_______________________________________________________________



Mon Style.css
_______________________________________________________________
Body {
background-image: url(Images/Background.jpg);
background-repeat: repeat;
margin: 0 px 0 0 0;
padding: 0 0 0 0;
text-align: left;
}
#Header {
margin: 0 px 0 0 0;
padding: 0 px 0 0 0;
height: auto;
width: auto;
position: static;
left: 0px;
top: 0px;
}
#Header #Menu {
background: #000;
margin: 0;
padding: 0;
list-style-type: none;
}
#Header #Menu li {
margin: 0 0 0 0;
padding: 0;
float: left;
border: 0;
}
#Header #Menu li a {
text-decoration: none;

border: 1 px solid # bdb;
display: block;
border: 0;
width: 100px;
height: 25px;
color: #FFF;
background-image: url(Images/Back_bt_a.jpg);
cursor: crosshair;
text-align: center;
}
#Header #Menu a:hover {
color: #FF0000;
cursor: crosshair;
background-image: url(Images/Back_bt_ahover.jpg);
}
_____________________________________________________________________

Ce que je veux faire:
- Transformer mon menu rollhover en rollhover déroulant en catégories et sous-catégories
- Positionner mon menu en haut à gauche de la page ( 0;0 ) et ce, même lors du déroulement de la page, sans javascript
- Que mon menu ait un effet de transparence, c'est à dire que l'on voit le texte et les images, lors du déroulement de la page ainsi que dans la navigation du menu.

Je cherche aussi:
- Toutes les personnes motivées prêtes à travailler ( volontairement ) sur un projet de site ( celui que je prépare ) qui rapporte tout ce qui est possible et imaginable sur les rapports PSP-PSX ( POPS )
- Un hébergeur gratuit, avec un nom de domaine gratuit, ayant un espace de stockage initial de 10Go minimum.


Merci
A voir également:

6 réponses

Utilisateur anonyme
21 juin 2008 à 00:32
-Pour les menus déroulants, tu peux t'inspirer ici : http://css.alsacreations.com/Construction-de-menus-en-CSS/Un-menu-deroulant-en-CSS-et-XHTML-vertical-et-horizontal
-Position en haut à gauche {left:0px;top:0px;position:absolute;}
-Effet de transparence avec opacity
1
Black_Winged_Angel Messages postés 299 Date d'inscription mardi 11 décembre 2007 Statut Membre Dernière intervention 22 novembre 2008 30
21 juin 2008 à 00:44
Quand tu pales de left et de top, tu veux dire margin-left 0px et margin-top 0px?
Parce que je l'ai déjà mis à

#Header
margin 0px ( top ) 0px (left)
0
Utilisateur anonyme > Black_Winged_Angel Messages postés 299 Date d'inscription mardi 11 décembre 2007 Statut Membre Dernière intervention 22 novembre 2008
21 juin 2008 à 00:46
Non je parlais pas des marges, mais si tu l'as déjà mis, pas la peine de rajouter.
Par ailleurs, tu as une balise <p> en trop dans ton code.
0
Black_Winged_Angel Messages postés 299 Date d'inscription mardi 11 décembre 2007 Statut Membre Dernière intervention 22 novembre 2008 30
21 juin 2008 à 00:54
Je sais je l'ai supprimée, par contre j'ai essayé left et top, résultat mon menu est à fond à gauche ( nickel ), par contre le top n'a pas fonctionné ( j'ai une ligne de background qui s'affiche )
0
Black_Winged_Angel Messages postés 299 Date d'inscription mardi 11 décembre 2007 Statut Membre Dernière intervention 22 novembre 2008 30
21 juin 2008 à 00:56
Réponse:
#Header #Menu
margin 0px 0px

Par contre maintenant, lors du déroulement de la page, le menu lui aussi remonte :-/
Y'a pas une technique?

Et opacity n'est pas une propriété css valide ( d'après dreamweaver )
0
xavierh Messages postés 72 Date d'inscription mardi 3 juin 2008 Statut Membre Dernière intervention 9 août 2009 25
5 juil. 2008 à 08:27
Tu fais dans le div qui enveloppe tout ton menu {
position: fixed
}
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Black_Winged_Angel Messages postés 299 Date d'inscription mardi 11 décembre 2007 Statut Membre Dernière intervention 22 novembre 2008 30
5 juil. 2008 à 14:43
html:
<div id="Header">Contenu</div>

css:
div #Header
Position 0 0 0 0 fixed

Marche pas
0
xavierh Messages postés 72 Date d'inscription mardi 3 juin 2008 Statut Membre Dernière intervention 9 août 2009 25
5 juil. 2008 à 20:24
Dans le CSS tu écrit text ceci:

#header
{
position: absolute;
position: fixed;
}

Je ne sais pas si le absolute est obligatoire mais moi quand je fais comme ça, ça marche.
Sinon je peux pas t'aider.
0