Autor Zpráva
THErENDy
Profil *
ahoj mam problém s vyditelnosti( průhlednosti) u různých prohližečů jde o vytvoření "vysouvacího menu" pomocí css . nicméně bych potřeboval aby bylo 50 % průhledne pozadi což umím udělat jen pro operu a mozillu ale IE to nepochopí nebo jen pro IE a mozillu a opera zas zpruhlední i text ( tak, že je nečitelný) jo kod:
<div id="vertikalni-menu">
  <ul>
    <li><a href="#">Odkaz</a></li>
    <li><a href="#">Odkaz</a>
      <ul>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
      </ul>
    </li>
    <li><a href="#">Odkaz</a>
      <ul>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
      </ul>
    </li>
    <li><a href="#">Odkaz</a></li>	
  </ul>
</div> <!-- vertikalni-menu konec -->


a ccs:
#vertikalni-menu{
	position: relative;
	top: -76px;
	left: 1px;
	width: 110px;
	float: left;
	margin: 0px;
	font-size: 12px;
	text-align: center;
	line-height: normal;
	padding: 0px 0px 5px 0px;
	
}
#vertikalni-menu li {
	display: block;
	height: 24px;
	width: 104px;
	line-height: 24px;
	text-decoration: none;
	padding: 0 1px;
	float: left;
	list-style-type: none;
	position: relative;
	
}
#vertikalni-menu li a {
	display: block;
	height: 24px;
	width: 104px;
	line-height: 24px;
	text-decoration: none;
	color: Gray;
	padding: 0 3px;
	background: Black url(menu.jpg);
}
#vertikalni-menu li a:hover {
	background: Red;
	color: #fff;
	border-left: 1px Gray;
}
#vertikalni-menu li ul{
	position: absolute;
	top: 0;
	left: 110px;
	visibility: hidden;
	background: White;
}
#vertikalni-menu li:hover ul{
	visibility: visible;
	display: block;
	position: absolute;
	border: solid #F0F0F0;
	border-width: 0 1px 1px 1px;
}
#vertikalni-menu li:hover ul li {
	display: block;
	position: relative;
	float: none;
	height: 24px;
	width: 110px;
	border-top: 1px solid #F0F0F0;
}
#vertikalni-menu li:hover ul li a {
	background: black;

}
#vertikalni-menu li:hover ul li a:hover {
	background: Purple;
	color: #fff;
}


Otázka zni kde umístit
filter: alpha(opacity=50)
	-moz-opacity: 0.5;
	opacity: 0.5; 

aby to bylo viditelné pozadí u všech stejne .
omlouvám se za ******* dotaz ale ja už fakt nevím, díky


Moderátor DoubleThink: Vkládej prosím kódy mezi značky [pre] a [/pre] (stačí kliknout na ).
pexxxik
Profil
Ahoj, jdeš na to špatně, v podstatě si musíš rozdělit průhledné pozadí a text a pak to na sebe napozicovat. Příklad je na těchto stránkách, když najedeš na fotogalerie, z toho by jsi to měl pochopit, jinak stránky neber vážně...
THErENDy
Profil *
přiklad je zde http://teniskaportal.ic.cz/index.html -- tohle se v pořádku vykresli ve všech prohližečích ( jde mi ted o barvu pozadi - nikoliv o to že mi to vysouvaci menu trochu uhlo :c) ) tedy když je viditelnost na 100% tak je všechno v pořádku problém je jakmile ji začnu měnit. na
filter: alpha(opacity=50)
-moz-opacity: 0.5;
opacity: 0.5;

díky

top: -76px; tam ted nepatří
pexxxik
Profil
já vím, já také nemluvím o pohybu submenu jen, že by to mělo vypadat nějak takhle:
<div>
  <div></div>                       // Tomuto divu dáš průhlednost 50%, potřebnou výšku a šířku, a pozadí které potřebuješ
  <a href="#">Odkaz</a>   // Odkazu dáš position: absolute, a pak pomocí top a left si ho nastavíš na pozadí
</div>
THErENDy
Profil *
pexxxik:
jasne už chápu ... :c) mi to nemysli jdu to zkusit dík
THErENDy
Profil *
nevim, nejde mi to do hlavy nějak ... ehm takhle mam problem v tomto příkladu zkuste si to otevřít v mozille a i IE ( tak bych chtěl aby se to zobrazilo ) a v opere ( zde nevidite žadné pismo ) je problém nevíte jak tento konkrétní problém vyřešit?
CSS:
#vertikalni-menu{
	position: relative;
	width: 110px;
}
#vertikalni-menu li {
	display: block;
	line-height: 24px;
	text-decoration: none;
	padding: 0 1px;
	float: left;
	list-style-type: none;
	position: relative;
		
}
#vertikalni-menu li a {
	display: block;
	height: 24px;
	width: 104px;
	line-height: 24px;
	text-decoration: none;
	color: Gray;
	background: Black;
	filter: alpha(opacity=50); 
	-moz-opacity: 0.5; 
	opacity: 0.5;
}
#vertikalni-menu li a:hover {
	background: Red;
	color: #fff;
	border-left: 1px Gray;
}
#vertikalni-menu li ul{
	position: absolute;
	top: 0;
	left: 110px;
	visibility: hidden;
	background: White;
}
#vertikalni-menu li:hover ul{
	visibility: visible;
	display: block;
	position: absolute;
	border: solid #F0F0F0;
	border-width: 0 1px 1px 1px;
}
#vertikalni-menu li:hover ul li {
	display: block;
	position: relative;
	float: none;
	height: 24px;
	width: 110px;
	border-top: 1px solid #F0F0F0;
}
#vertikalni-menu li:hover ul li a {
	background: black;
		filter: alpha(opacity=50); 
	-moz-opacity: 0.5; 
	opacity: 0.5;
}
#vertikalni-menu li:hover ul li a:hover {
	background: Purple;
	color: #fff;
}


a html je furt stejny
<div id="vertikalni-menu">
  <ul>
    <li><a href="#">Odkaz</a></li>
    <li><a href="#">Odkaz</a>
      <ul>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
      </ul>
    </li>
    <li><a href="#">Odkaz</a>
      <ul>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
        <li><a href="#">Vysouvaci Odkaz</a></li>
      </ul>
    </li>
    <li><a href="#">Odkaz</a></li>    
  </ul>
</div> <!-- vertikalni-menu konec -->

prakticky by to šlo změnit barvu textu jen pro prohlížeč opera :c)
pexxxik
Profil
Jestli to chápu správně, chceš mít průhledné pozadí a text neprůhledný v tomto příkladů, ale dáváš průhlednost na odkazy, tam vůbec nepatří....

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: