Partage
  • Partager sur Facebook
  • Partager sur Twitter

Problème de transparence

On voit a travers un bloc

Sujet résolu
28 février 2006 à 19:19:57

Salut a tous, je me suis lancé dans la construction d'un site et je voulais faire un système de menu horizontal où quand on survole un lien du menu, un div s'affiche.

je vais vous donner une partie du code.

ce code se trouve dans l'id menu

<span class="surp"><a href="blog.php">Blog</a>
<div id="sous_menu_blog"><p>Rien de nouveaux</p></div>
</span>



#menu #sous_menu_blog a
{
background: #e0e5ff;
border:none;
margin: 0px;
padding: 0px;
color: blue;
}

#menu #sous_menu_blog .souslien
{
background: #e0e5ff;
width: 98%;
border: solid 1px blue;
text-align: center;
padding: 0px;
}

#menu #sous_menu_blog p
{
background: #e0e5ff;
text-align:center;
margin: 2px;
}
#menu #sous_menu_blog
{

background: #e0e5ff;
display: none;
border: solid 2px #869dff;
width: 150px;
position: absolute;
margin-top: -1px;
left: 91px;
}

#menu .surp:hover>#sous_menu_blog
{

background: #e0e5ff;
display: block;
}


il y a une partie qui modifie l'apparence du lien (a) qui ne sert a rien pour le moment car j'ai écris "rien de nouveau" en attendant de mettre des liens a la place.

Mon problème est que quand il y a du texte en dessou du bloc qui apparais, on voit le texte a travers et d'une part c'est moche et d'autre part le curseur va se fofiller en dessou du bloc ce qui va le faire disparaitre alors que je ne voulais pas.

j'ai fait un test sur une autre page avec les codes suivant :
  <span class="surp"><a href="qer">COUCOU</a>
   <div id="bleu">
<a href="eoriuj">c'est moi</a>
</div></span>
<p>
ceci est un texte pour verifier si on ne voit pas a travers mon bloc ceci est un texte pour verifier si on ne voit pas a travers mon blocceci est un texte pour verifier si on ne voit pas a travers mon blocceci est un texte pour verifier si on ne voit pas a travers mon blocceci est un texte pour verifier si on ne voit pas a travers mon blocceci est un texte pour verifier si on ne voit pas a travers mon blocceci est un texte pour verifier si on ne voit pas a travers mon blocceci est un texte pour verifier si on ne voit pas a travers mon blocceci est un texte pour verifier si on ne voit pas a travers mon blocceci est un texte pour verifier si on ne voit pas a travers mon bloc</p>

body/*le corp des pages */
{
width : 760px;
padding : 20px;
background: #e0e5ff;
}

p
{
text-align:left;
}

.surp:hover>#bleu
{

display: block;
}

#bleu
{

display: none;
border: solid 2px #869dff;
width: 150px;
position: absolute;
top: 300px;
margin: 100px;
background: #e0e5ff;
margin-top: -1px;
left: 253px;
}


et là tout marche nikel

je ne comprend pas. quelqu'un peut m'aider??? :euh:
  • Partager sur Facebook
  • Partager sur Twitter
28 février 2006 à 19:31:51

Salut,

Je n'ai pas vraiment compris.

T'as pas une page en ligne pour que l'on visualise l'effet ?

Par contre un <p> et un <div> dans un <span> , ce n'est pas correct (blocks dans inline).
  • Partager sur Facebook
  • Partager sur Twitter
28 février 2006 à 22:28:22

Image utilisateur

voilà une vapture ecran du bug, je n'ai pas mis en ligne le site le le construit entièrement avant.
dans ce cas c'est peut etre un problème de type line dans les bloc.
là le problème est hestétique mais en meme temps, le sous menu (où il y a ecris logiciel etc...) se referme si le curseur n'est pas sur un lien (alors qu'il devrait rester si je le met n'importe ou sur le div.

merci

  • Partager sur Facebook
  • Partager sur Twitter
1 mars 2006 à 2:42:40

Mets une couleur de fond à ton sous menu, ça évitera le double affichage...
  • Partager sur Facebook
  • Partager sur Twitter
1 mars 2006 à 9:59:06

justemment j'en ai mis partout pour eviter ça et ça ne marche pas.
  • Partager sur Facebook
  • Partager sur Twitter
8 mars 2006 à 13:45:48

bon, je n'ai pas résolut ce problème, en fait c'est dû au fait qu'il y a un bloc (div) en dessou de mes sous menus (qui s'affichent si il y a un hover sur le titre). il faudrais que je mette ces sous menu en premier plan, il n'y a pas un moyen???
  • Partager sur Facebook
  • Partager sur Twitter
11 mars 2006 à 14:35:59

c'est bon j'ai trouver une solution. il suffisais de trouver une formule css pour mettre le menu au premer plan

z–index: 100;


plus la valeur est elevé plus le block est au premier plan. j'ai mis 100 pour etre sur qu'il est au premier plan.

En tout cas merci.
  • Partager sur Facebook
  • Partager sur Twitter

Problème de transparence

× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
× Attention, ce sujet est très ancien. Le déterrer n'est pas forcément approprié. Nous te conseillons de créer un nouveau sujet pour poser ta question.
  • Editeur
  • Markdown