Autor | Zpráva | ||
---|---|---|---|
Jiriczek55 Profil |
#1 · Zasláno: 24. 10. 2014, 06:29:38
Na mých stránkách www.svatbyvbeskydech.cz, mám ikonkové menu, je mi někdo schopen poradit, ideálně vypsat kód, aby se mi při hoveru ukazoval popisek odkazu? Děkuji moc.
/** NAVIGATION **/ .navbar { width:100%; z-index: 1000; text-align:center; position:relative; margin-bottom:0px; background:transparent; font-size: 0px; line-height: 0px; border-radius: 0px; border: 0px solid transparent; } .navbar-inner { min-height: 110px; padding-right: 0px; padding-left: 0px; background-color: transparent; background-image: none !important; border: 0px solid #d4d4d4; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; filter:progid:DXImageTransform.Microsoft.gradient(enabled = false); -webkit-box-shadow: 0 0px 0px rgba(0, 0, 0, 0.065); -moz-box-shadow: 0 0px 0px rgba(0, 0, 0, 0.065); box-shadow: 0 0px 0px rgba(0, 0, 0, 0.065); margin-left: auto; margin-right: auto; display:inline-block; } .navbar .nav { background: rgba(61, 70, 84,0.2); list-style: none; display: inline-block; -webkit-border-radius: 60px; -moz-border-radius: 60px; border-radius: 60px; border:0px solid; padding: 15px; text-align: center; margin: 0px; } .navbar .nav li { float:left; margin-left:10px; display:block; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .navbar .nav li:first-child { margin-left:0px; } .navbar .nav > li > a { float: none; padding:0px; color: #FFF; background: #757081; text-decoration:none; display:block; text-align:center; padding: 0px; width:80px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .navbar .nav > li > a:focus { border: 0px solid transparent; } .navbar .nav > li > a i { width:40px; line-height:80px; font-size:40px; } .navbar .nav > li:hover > a{ color:#FFF; text-decoration:none; display:block; background-color: #696574; } .navbar .nav > .active > a, .navbar .nav > .active > a:hover, .navbar .nav > .active > a:focus { color: #FFF; text-decoration: none; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; } |
||
Joker Profil |
#2 · Zasláno: 24. 10. 2014, 07:18:14
<a href="adresa" title="popisek"></a> |
||
Marschmallow Profil |
#3 · Zasláno: 24. 10. 2014, 07:27:01
Jiriczek55:
Pomocí CSS lze. Pročetl bych si článek Popisek po najetí myší. |
||
Jiriczek55 Profil |
#4 · Zasláno: 24. 10. 2014, 08:16:44
Jde mi konkrétně o řešení přizpůsobené mé stránce, tzn. ať se text nebije s ikonou, ať je dobře čitelný, třeba ať vyjíždí nad ikonu.
Pokud bude řešení "luxusní" rád se odměním. |
||
Taurus Profil |
#5 · Zasláno: 24. 10. 2014, 09:22:14
Na té stránce jsou dokonce zdrojové kódy. Co už si jen víc přát. Stačí to graficky odladit a je to.
|
||
Str4wberry Profil |
#6 · Zasláno: 24. 10. 2014, 09:43:46
Osobně bych využil spíš toho
<strong> u, co tam je, a title úplně vyhodit (jen duplikuje tutéž informaci).
Nějak takhle třeba: Odkaz |
||
jefitto44 Profil |
#7 · Zasláno: 24. 10. 2014, 13:16:06
Alebo javascript ToolTip sa to volá
|
||
Jiriczek55 Profil |
#8 · Zasláno: 24. 10. 2014, 19:02:02
Str4wberry:
Pecka, dík moc. |
||
Marschmallow Profil |
#9 · Zasláno: 24. 10. 2014, 19:20:57
Str4wberry:
Jen bych ty popisky přesunul do dolní části. Protože po odrolování a tím zobrazení fixního menu se popisky nezobrazují. |
||
kukuč Profil * |
#10 · Zasláno: 24. 10. 2014, 19:29:29
Hezké, ale asi to nepůjde v IE9 a nižším.
|
||
Str4wberry Profil |
#11 · Zasláno: 24. 10. 2014, 19:52:58
Reakce na kukuče:
V IE 9 nepůjde plynulá změna průhlednosti přes transition . To ale není taková tragédie.
V IE 8 potom nebude fungovat poloprůhledné pozadí přes rgba , což řešit jde, ale jelikož ten web je v IE 8 celý rozpadlý, tak jsem to neřešil.
Jinak není použito nic, co by ve zmíněných prohlížečích nemělo fungovat. No, ještě v IE 7 nebudou fungovat ty šipky přes :before (protože to funguje až od IE 8), to by šlo nahradit prázdným elementem.
Reakce na Marschmallowa: Aha, toho jsem si nevšiml. Tak to už není problém snadno změnit. Odkaz |
||
Časová prodleva: 10 let
|
0