| Autor | Zpráva | ||
|---|---|---|---|
| jefitto44 Profil |
#1 · Zasláno: 28. 3. 2014, 07:42:52
Existuje nejaký spôsob, ako nastaviť hover elementu, ktorý má inline definovaný div?
<div style="blabla"> potrebujem takémuto divu nastaviť hover. Dá sa to nejako? |
||
| Plaváček Profil |
#2 · Zasláno: 28. 3. 2014, 08:05:17
Třeba takto?
<style type="text/css">
div[style]:hover {
color:#ffcc00
}
</style> |
||
| jefitto44 Profil |
#3 · Zasláno: 28. 3. 2014, 08:19:42
Nefunguje... dávam tu celý kód, aspoň budte vedieť, prečo to nemôžem dať do externého CSS
echo '<style type="text/css">
a[style] :hover {
border:4px solid #4eadff;
}
</style>';
print '<a style="border:4px solid #fff; border-radius:3px;width:150px;height:100px;display:block;background:url('.ROOTDIR.'/photos/thumbail/'.$img["src"] . '); background-position: center top;" href="'.FunkciaKtoraVygenerujeHrefPreKažduFotku($fotogaleria['id']).'"> </a>'; |
||
| Trejpa Profil |
#4 · Zasláno: 28. 3. 2014, 08:24:28
jefitto44:
Najdi jeden rozdíl: a[style] :hover a[style]:hover |
||
| jefitto44 Profil |
Nefunguje ani s medzerou, ani bez medzery
Skúšal som obidva V prvom prípade uvádzam div preto, že tam bol pôvodne div. Teraz som to ale prerobil tak, že som ten div skopíroval do stylu odkazu |
||
| TomasJ Profil |
jefitto44:
Vlastnost :hover ve všech prohlížečích podporuje jen tag <a>, v novějších pak i tag <li> a některé další, ale DIV mezi to nepatří. Pokud chceš aby to byl opravdu div, použij následující konstrukci:
<style>
a:hover div{
background: #444;
color: white;
}
</style>
<a href="#"><div style="blablabla">Něco</div></a>Pokud chceš použít hover jen na element a, ale ne na všechny elementy a, urči si například class:
<style>
a.special:hover{
color: black;
background: #ddd;
}
</style>
<a class="special" href="#">.............</a> |
||
| Plaváček Profil |
#7 · Zasláno: 28. 3. 2014, 08:37:44
jefitto44:
No, mně to funguje. Viz http://klient.plavacek.net/hover.html. |
||
| peta Profil |
#8 · Zasláno: 28. 3. 2014, 08:37:50
jefitto44: Php kod fakt prohlizec neumi.
* Inline styl ma prednost pres style tagem. Zkus pouzit !important. * Trejpa Jsi mohl dat html kod hned :) |
||
| jefitto44 Profil |
#9 · Zasláno: 28. 3. 2014, 08:41:01
TomasJ
Finta, ktorú uvádzaš je nevalidná a Content Manager mi to vráti, že si to mám niekde strčiť, pretože bude stránka nevalidná. Neviem čo som za d*bila, ale viaceré veci mi fungujú nejako divne dneska... |
||
| TomasJ Profil |
jefitto44:
„Finta, ktorú uvádzaš je nevalidná a...“ Že používáš inline styly Ti nevadí? To neovlivní validitu, ale ubere podle některých měřičů na hodnocení SEO (viz seo-servis) „ale viaceré veci mi fungujú nejako divne dneska“ A jak už píše Plaváček v příkladu a peta ve zprávě, použij na konec !important jak je psáno v odkazu v [#7] peta: „Php kod fakt prohlizec neumi.“ Asi jsi se přehlídnul, celé je to napsané v PHP ( echo a print).
|
||
| Bubák Profil |
#11 · Zasláno: 28. 3. 2014, 09:07:00
TomasJ:
„Vlastnost :hover ve všech prohlížečích podporuje jen tag <a>, v novějších pak i tag <li> a některé další, ale DIV mezi to nepatří.“ Téměř všechny elementy podporují :hover, DIV mezi ně patří. „Že používáš inline styly Ti nevadí? To neovlivní validitu, ale ubere podle některých měřičů na hodnocení SEO (viz seo-servis)“ Měření SEO má menší význam, něž měření pindíků. jefitto44: „Finta, ktorú uvádzaš je nevalidná“ Není tomu tak, je to validní. „ale viaceré veci mi fungujú nejako divne dneska...“ Já nemám problém, změna barvy textu podle Plaváčka funguje, změna barvy pozadí bez !important nefunfuje, důvod vysvětlil [#8] peta a změna rámečku s !important funguje. http://kod.djpw.cz/yncb- http://kod.djpw.cz/yncb Co ale nechápu, je, proč je nutné použít „Hover pri inline štýle“ a v PHP generuješ výše uvedenou fujku, která zejména znepřehledňuje kód. |
||
| Trejpa Profil |
#12 · Zasláno: 28. 3. 2014, 09:09:05
TomasJ:
„Vlastnost :hover ve všech prohlížečích podporuje jen tag <a>“
Ve standardním režimu vlastnost :hover na prakticky všech elementech (včetně DIV) podporují všechny běžné prohlížeče, Internet Explorer od verze 7 (podpora pro nižší verze viz hover.htc, jinak to umí jen na odkazech). jefitto44 to navíc na odkaz použít chce. Horší je to s podporou zaměřování atributů (ta hranatá závorka), tu podporuje až Internet Explorer 8. „Že používáš inline styly Ti nevadí?“ Proč by mělo? Třeba je inline styl použit třeba jen jako výjimka z ostatních stylů. Nebo má HTML kód, který nemůže změnit. „ubere podle některých měřičů na hodnocení SEO“ Pojednání o zbytečnosti SEOmatů peta: „Inline styl ma prednost pres style tagem.“ Jak do inline stylu asi dostane :hover, o který mu celou dobu jde? jefitto44: „Finta, ktorú uvádzaš je nevalidná“ Na validitě prohlížečům, vyhledávačům ani návštěvníkům nezáleží, proč tobě ano? Zanoření bloku do odkazů prohlížečům nikdy nevadilo, navíc v HTML 5 to validní je, stačí vyměnit doctype za <!DOCTYPE HTML>.
Nejkompatibilnější řešení je použít na odkaz třídu a zaměřovat odkazy podle ní, nikoliv podle atributů. <style>
.odkaz-se-stylem:hover { }
</style>
<a href="#" style="" class=odkaz-se-stylem>odkaz</a> |
||
| peta Profil |
TomasJ: ??? Ja ti vubec nerozumim. Ze je to psane v php jsem preci psal. Kdyz jsem to chtel testovat, tak jsem z toho musel to php pracne odmazavat. Kdezto jemu stacilo v prohlizeci zobrazit kod a zkopirovat to z neho. Normalne bych se na to vybod, ale protoze jefitto je novacek, kterej ma o problem fakt zajem a ne pristup udelejte mi to.
|
||
| Trejpa Profil |
#14 · Zasláno: 28. 3. 2014, 09:31:38
jefitto44:
„vždy mi ľudia vraveli, že do <a> nemôže ísť nič iné ako text“ Posloucháš špatné lidi. Do odkazu nepatří formulářové prvky a jiné odkazy, jinak prakticky cokoliv. Do verze HTML 4.01 byly v odkazech validní jen inline a inline-block elementy. Prohlížeče ale žádné verze HTML nerozlišují. „Inline style je preto, že si to z premennej ťahá obrázky do backgroundu.“ Libovolný uživatelský obrázek je oprávněný požadavek na background-image v inline stylech, vše ostatní dej pryč: <style>
.odkaz-se-stylem { /* to, co jsi měl v inline stylu, vč. výchozího obrázku */ }
.odkaz-se-stylem:hover { /* styly pod kurzorem, jen co se mění */ }
</style>
<a href="#" style="background-image:url('uživatelský-obrázek.png');" class=odkaz-se-stylem>odkaz</a> |
||
| jefitto44 Profil |
#15 · Zasláno: 28. 3. 2014, 09:33:11
Mám to napísať slušnejšie:
IE lt8 neriešime v robote vôbec, takže pohoda Bubak, vždy mi ľudia vraveli, že do <a> nemôže ísť nič iné ako text, alebo img... ak tam môže ísť aj div, tak to som rád a veľmi mi to pomôže :) Dik Inline style je preto, že si to z premennej ťahá obrázky do backgroundu. Nemôžem do style.css vypísať predsa php premennú, lebo sa to na mňa vykaká |
||
| Trejpa Profil |
jefitto44:
Reakce je výše [#14]. |
||
| peta Profil |
#17 · Zasláno: 28. 3. 2014, 12:32:32
jefitto44: Pomoci php muzes vypsat class. K nemu styly pak do css. Nebo muzes volat soubor.php?parametry, ktery ti vrati css (ale to je horsi reseni, protoze pak se css nebude kesovat). Take muzes udelat druhy css, ktery bude prave jako vystup soubor.php.
Mozna by slo pouzit JS, treba opet externi script jako soubor.php. Zalezi na tom, ceho presne chces docilit. |
||
| Fisir Profil |
#18 · Zasláno: 29. 3. 2014, 13:33:14
Existuje nějaká specifikace, podle které je možné definovat styly pro pseudotřídu
:hover (a další) i při jejich inline zápisu. Bohužel, nepodařilo se mi to rozchodit.
|
||
| anonymníí Profil * |
#19 · Zasláno: 29. 3. 2014, 15:25:45
[#12] Trejpa
„Horší je to s podporou zaměřování atributů (ta hranatá závorka), tu podporuje až Internet Explorer 8.“ minimálně ve std. režimu je podpora od IE7 včetně. |
||
| jefitto44 Profil |
#20 · Zasláno: 31. 3. 2014, 14:14:16
IE8 stačí... už to baví podľa tohto:
2
3
4
5<style type="text/css">
div[style]:hover {
color:#ffcc00
}
</style> |
||
|
Časová prodleva: 10 let
|
|||
0