| Autor | Zpráva | ||
|---|---|---|---|
| mlpb Profil |
#1 · Zasláno: 2. 6. 2011, 23:46:25
Zdravím, potrebujem dostylovať nasledujúce menu. Problém je v tom, že keď sa vyroluje submenu tak položka "História" prestane byť aktívnou (farba pozadia sa zmení na pôvodnú) a položky v submenu sa po najetí myšou nezafarbia v plnej šírke, ale len v šírke textu.
A ešte jeden problém v IE a Opere sa submenu zobrazí horizontálne a nie vertikálne. Odkaz na css styl. Vopred ďakujem za rady |
||
| DarkMeni Profil * |
#2 · Zasláno: 3. 6. 2011, 18:04:07
Tak "Historia" může přestat "svítit" asi proto že jestli je nastylovaná a né nascriptovaná tak to nevím že má "svítit"
Nastylovaná = .menu:hover {/*styl*/} Naskriptovaná = document.getElementsByClassName("menu")[x]...onmouseover = function(){} ... onmouseout = functon()... A pro důvod proč se špatně vysunuje -> To teda nevim ale možná je tam špatné nastavený skript a nebo styl, ale když sem se tak namátkou kouk, tak je ve stylu definovaných tolik tříd že v samotném webu nebude asi ani polovina. Nemohl by jsi sem dát ukázku jen samotné funkce a stylu jen na to menu? |
||
| mlpb Profil |
#3 · Zasláno: 3. 6. 2011, 18:11:44 · Upravil/a: mlpb
Na menu nie je použitý žiaden skript iba CSS a nie som si istý, či sa to len pomocou CSS dá.
/* Navigacia */
.header .nav {
position:absolute;
right:0;
top:93px;
}
.header .nav ul li {
float:left;
}
.header .nav li a {
float:left;
padding:12px 21px 18px 21px;
font-size:16px;
line-height:1.2em;
color:#fff;
text-decoration:none;
text-shadow:1px 1px 0 #004376;
position:relative;
}
.header .nav li a.current {
background:#7e9401;
border-radius:7px;
-moz-border-radius:7px;
-webkit-border-radius:7px;
behavior:url(js/PIE.htc);
}
.header .nav li a:hover {
background:#7e9401;
border-radius:7px;
-moz-border-radius:7px;
-webkit-border-radius:7px;
behavior:url(js/PIE.htc);
}
/* Subnavigacia */
.header .nav li ul {
display: none;
width: auto;
background-color: #7e9401;
z-index:10;
border-radius:7px;
-moz-border-radius:7px;
-webkit-border-radius:7px;
}
.header .nav li:hover ul {
display: block;
position: absolute;
margin: 40px 0 0 0;
padding: 0;
border-radius:7px;
-moz-border-radius:7px;
-webkit-border-radius:7px;
}
.header .nav li:hover li {
float: none;
}
.header .nav li:hover li a {
background-color: #7e9401;
color: #ffffff;
}
.header .nav li li a:hover {
background-color: #98b300;
} |
||
| DarkMeni Profil * |
#4 · Zasláno: 3. 6. 2011, 18:23:31
Vau, to je docela složitý, v behaviorech se nevyznám tak je nepoužívám a toto je moc rozepsaný, ale jestli ".header .nav li a:hover" je styl pro Menu po přejetí myší, tak aby ta "Historia" po zobrazení zůstala aktivní to chce skript, protože tím jak najede na submenu už vlastně není ten odkaz historie přejetý tak ten ":hover" neplatí. Ale proč se špatně vysunuje ti snad dokáže poradit někdo zkušenější.
Jednoduchý skript který by u "Historie" mohl nahradit ":hover" by mohl vypadat nějak takto:
<script type="text/javascript">
var Odkaz = document.getElementById("historie");
Odkaz.onmouseover = function(){
Odkaz.style.backgroundColor = "green";
}
Odkaz.onmouseout = function(e){
var Event = e || window.event;
if(Event.target.className!="subMenu"){
Odkaz.style.backgroundColor = "transparent";
}
}
</script>
Takle nějak by mohl vypadat ale tenhle skript toho moc neudělá, jestli javascriptu dobře rozumíš tak by jsi něco pro nahrazení ":hoveru" mohl udělat. |
||
| mlpb Profil |
#5 · Zasláno: 3. 6. 2011, 19:47:41
Vďaka za rady, ale js neovládam. Vyriešil som to zmenou v CSS.
|
||
|
Časová prodleva: 13 let
|
|||
0