Autor | Zpráva | ||
---|---|---|---|
Fyrbach Profil |
Mam CSS menu ktere je funkcni v iOS, Android, ve vsech prohlizecich pro PC ale nerozbali se na Nokii s Windows phone.
Javascript to nedela je to nekde v CSS pomuze mi nekdo? Ukazka www.lipno-pocasi.cz/test CSS /** ********************************************* * Prototype of styles for horizontal CSS-menu * @data 30.06.2009 ********************************************* * (X)HTML-scheme: * <div id="menu"> * <ul class="menu"> * <li><a rel="nofollow" href="#" class="parent"><span>level 1</span></a> * <div><ul> * <li><a rel="nofollow" href="#" class="parent"><span>level 2</span></a> * <div><ul><li><a rel="nofollow" href="#"><span>level 3</span></a></li></ul></div> * </li> * </ul></div> * </li> * <li class="last"><a rel="nofollow" href="#"><span>level 1</span></a></li> * </ul> * </div> ********************************************* */ /* menu::base */ div#menu { color: #757575; font-size: 11px; line-height: 150%; } a { outline: 0; } ul.menu { clear: both; float: none; cursor: pointer; z-index: 1; position: relative; } div#menu ul { margin: 0px; padding: 0px; list-style: none; float: left; z-index: 22; position: relative; } div#menu li { position: relative; margin: 0px; padding: 0px; display: block; overflow: visible; float: left; height: 30px; z-index: 23; } /* menu::level1 */ div#menu li a { height: 30px; display: block; float: left; line-height: 30px; text-decoration: none; color: #757575; overflow: hidden; z-index: 24; position: relative; } div#menu li span { color: #757575; display: block; padding: 0 15px; background-repeat: no-repeat; background-position: 95% 0px; z-index: 26; position: relative; } div#menu li span.bg { display: block; background: transparent url('../grafika/menu-images/menu_level1_item.png') repeat-x scroll 0pt 100%; padding: 0; height: 30px; z-index: 5; position: relative; float: left; } div#menu li.current { font-weight: bold; } div#menu li.current ul { font-weight: normal; } /* menu::level2 */ div#menu ul.menu ul { padding: 0px 0px 10px; background: transparent url('../grafika/menu-images/menu_dropdown_bg.png') no-repeat scroll 0pt 100%; _background: transparent url('../grafika/menu-images/menu_dropdown_bg.gif') no-repeat scroll 0pt 100%; left: -999em; width: 202px; position: absolute; top: 30px; } div#menu li:hover ul, div#menu li.sfhover ul { left: 0px; z-index: 100; visibility: visible; } div#menu li li { width: 100%; text-indent: 0px; float: none; height: auto; } div#menu li li a, div#menu li li span.separator { margin: 0px 1px; padding: 0px; background: url('../grafika/menu-images/menu_level2_item.gif') no-repeat scroll 100% bottom; height: auto; float: none; display: block; line-height: 25px; width: 200px; } div#menu li li a.parent { background: url('../grafika/menu-images/menu_level2_item_parent.gif') no-repeat scroll 100% bottom; } /* menu::level3 */ div#menu li ul ul { margin: -31px 0 0 201px; } div#menu li:hover ul ul, div#menu li.sfhover ul ul { border-top: 0px solid #1E1E1E; } div#menu li:hover ul ul, div#menu li.sfhover ul ul, div#menu li:hover ul ul ul, div#menu li.sfhover ul ul ul, div#menu li:hover ul ul ul ul, div#menu li.sfhover ul ul ul ul { left: -999em; } div#menu li li:hover ul, div#menu li li.sfhover ul, div#menu li li li:hover ul, div#menu li li li.sfhover ul, div#menu li li li li:hover ul, div#menu li li li li.sfhover ul { left: 0pt; z-index: 120; } div#menu a:hover { color: #FFFFFF; } div#menu span:hover { color: #FFFFFF; } div#menu li ul span:hover { color: #FFFFFF; } Moderátor Chamurappi: Neobaluj prosím celý příspěvek mezi značky [>pre] a [>/pre].
|
||
Fisir Profil |
#2 · Zasláno: 18. 7. 2014, 18:04:50
Reaguji na Fyrbacha:
Ono to funguje, doslova tak, jak jsi to nakódoval. Pokud podržíš prst nad odkazem Home, menu vyjede. Ostatní mobilní prohlížeče jen simulují :hover . Rozbaluj menu i při :focus u.
|
||
Fyrbach Profil |
#3 · Zasláno: 18. 7. 2014, 20:00:57
Fisir:
Diky za vysvetleni a muzes mi poradit jak co mam zmenit a jak /jsem zacatecnik/ dik |
||
Časová prodleva: 10 let
|
0