| 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 |
#2 · Zasláno: 7. 2. 2010, 21:29:42
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 * |
#3 · Zasláno: 7. 2. 2010, 21:30:03
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 |
#4 · Zasláno: 7. 2. 2010, 21:41:30
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 * |
#5 · Zasláno: 7. 2. 2010, 21:44:24
pexxxik:
jasne už chápu ... :c) mi to nemysli jdu to zkusit dík |
||
| THErENDy Profil * |
#6 · Zasláno: 7. 2. 2010, 22:24:40
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 |
#7 · Zasláno: 8. 2. 2010, 21:23:30
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ří....
|
||
|
Časová prodleva: 14 let
|
|||
0