| Autor | Zpráva | ||
|---|---|---|---|
| jefitto44 Profil |
#1 · Zasláno: 26. 6. 2014, 11:49:08
Existuje nejaký spôsob, ako by som selectol všetky hoveri? Ide o to, že ku každému hoveru chcem dať transition, pôjde to takto?
*:hover { transition:all 300ms ease; } ? Dik |
||
| Bubák Profil |
#2 · Zasláno: 26. 6. 2014, 12:09:08
Bude to při hoveru fungovat, ale mám tušení, že netušíš, co to znamená, doporučuji více přemýšlet.
http://kod.djpw.cz/mdeb- |
||
| jefitto44 Profil |
#3 · Zasláno: 26. 6. 2014, 21:56:40
Nepovedal by som, že je to problem transitionu... skôr toho, ako si definoval background-position
http://www.electrocars.sk/ Tie odkazy vľavo... používajú výmenu backgroundu a transition... vidíš tam azda nejaké nechutné posuvanie? |
||
| Bubák Profil |
#4 · Zasláno: 27. 6. 2014, 08:42:01
jefitto44:
Neměl jsem na mysli posouvání, i když je fakt, že jsem ho vybral záměrně. Měl jsem na mysli, že máš transitions deklarované tak, že fungují pouze u hoveru. |
||
| Trejpa Profil |
#5 · Zasláno: 27. 6. 2014, 09:22:03
jefitto44:
Když najedeš myší, je to plynulé. Když odjedeš, tak se transition už neaplikuje. |
||
| Tomáš123 Profil |
#6 · Zasláno: 27. 6. 2014, 13:31:28
jefitto44:
Iba náhodou som našiel na hviezdičkovom :hoveri dve chyby (možno ich je aj viac):
1. Transition sa aplikuje iba pri nájdení myšou na položku (už to tu bolo spomenuté) teda odchod z položky nie je poctený transitionom; 2. Vlastnosti, ktoré si pridal selektoru *:hover sa prejavia na každom objekte na ktorý nájdeš myšou.
Živá ukážka: http://kod.djpw.cz/udeb |
||
| Bubák Profil |
#7 · Zasláno: 27. 6. 2014, 17:11:33
Tomáš123:
ad1. je to proto, že když z elementu odjedeš, nemá hover. Standardně se transition deklaruje pro element. ad 2. totéž, co *:hover udělá zápis :hover
|
||
|
Časová prodleva: 3 dny
|
|||
| jefitto44 Profil |
#8 · Zasláno: 30. 6. 2014, 07:44:25
Tomáš123:
„Vlastnosti, ktoré si pridal selektoru *:hover sa prejavia na každom objekte na ktorý nájdeš myšou.“ Nie tak celkom... najprv daný objekt musí mať definovaný hover. Transition sám o sebe nič nerobí... ak ja nedefinujem, čo sa má stať pri hoveri, nič sa nestane. To znamená, že ak budem mať odkaz, ale nedefinujem pre neho hover, transition síce bude, ale nebude ho vidno. Dajme tomu že by odkaz mal čiernu farbu, tým že nedefinujem hover, ostáva čierna farba aj pri hoveri.... hover z čiernej na čiernu == nič |
||
| Tomáš123 Profil |
#9 · Zasláno: 30. 6. 2014, 08:18:39
jefitto44:
„Nie tak celkom... najprv daný objekt musí mať definovaný hover.“ A načo je tam podľa teba tá hviezdička (ako povedal Bubák, bez hviezdičky je to to isté)? Nie náhodou preto, že vyberie každý prvok? „Transition sám o sebe nič nerobí...“ Vôbec nie, on slúži na to, aby bol stále párny počet riadkov v súbore. „ak ja nedefinujem, čo sa má stať pri hoveri, nič sa nestane.“ To je pravda, ale tebe nepríde zbytočné plniť súbor CSS podobnými selektormi?: *:hover {
}
:hover {
}„To znamená, že ak budem mať odkaz, ale nedefinujem pre neho hover, transition síce bude, ale nebude ho vidno.“ Chápeš, čo v CSS znamená hviezdička (*). Vyberie všetko!!!. Obávam sa, že si moju ukážku zle pochopil...Nejde v nej o to z akej farby na akú sa mení obsah, ale o zvýraznenie použitia :hoveru bez udania prvku na ktorý sa má vzťahovať, nevýhody takéhoto použitia a rozdiel medzi definovaním transition položke a :hoveru položke.
|
||
| jefitto44 Profil |
#10 · Zasláno: 30. 6. 2014, 09:20:30 · Upravil/a: jefitto44
Tomáš123:
„To je pravda, ale tebe nepríde zbytočné plniť súbor CSS podobnými selektormi?:“ Príde mi menej zbytočné použiť jedno *:hover { transition:all 300ms ease } ako ku každému odkazu, alebo obrázku písať zas a znova transition Ja viem že hviezdička vyberie všetko no a čo, však nech vyberie... keď nedefinujem čo sa má stať pri hoveri, nič sa nestane. nie je to azda tak? Tomáš123: „Vôbec nie, on slúži na to, aby bol stále párny počet riadkov v súbore.“ :D |
||
| Tomáš123 Profil |
#11 · Zasláno: 30. 6. 2014, 09:27:16
jefitto44:
„keď nedefinujem čo sa má stať pri hoveri, nič sa nestane. nie je to azda tak?“ Zle som ťa pochopil, moja chyba. Áno, je to tak, ale stále je tu nevýhoda: požadovaný efekt sa vykoná iba pri nájdení myši na položku. Tebe by sa skôr hodil selektor, ktorý vyberie elementy: img, a {
transition: all 300ms ease;
}
img:hover {
/*nejaké
vlastnosti*/
}
a:hover {
/*nejaké
vlastnosti*/
} |
||
| jefitto44 Profil |
#12 · Zasláno: 30. 6. 2014, 09:43:44
ano, to viem... dal by sa použiť aj rovno * {
transition:all 300ms ease } nie? |
||
| Bubák Profil |
#13 · Zasláno: 30. 6. 2014, 09:52:05
Tomáš123:
Odkaz je element a
Není to úplně pravda, odkaz je element a s atributem href, ale tuhle drobnost lze ve většině případů zanedbat. Ukázka je pro odkazy. http://kod.djpw.cz/kfeb http://kod.djpw.cz/kfeb- jefitto44: Správně, ať má procesor co počítat, vždyť proto tam je. |
||
| jefitto44 Profil |
#14 · Zasláno: 30. 6. 2014, 10:48:43
Myslím, že správca napájania zaťaží procesor tisíckrát viac ako jedno transition... nebuĎte smiešny. Trochu rozmýšľajte.. ako môže * transition zaťažiť procesor? Trošku... ako zaťaží procesor hocijaký doplnok, ktorý v chrome mám? Už nie je rok 1996, nemáme 120MHz procesory ani 8 MB RAMky... toto určite stránku spomaľovať nebude a ak, tak o milisekundu, ktorú si aj tak nikto nevšimne
|
||
| Trejpa Profil |
#15 · Zasláno: 30. 6. 2014, 11:02:45
jefitto44:
„toto určite stránku spomaľovať nebude a ak, tak o milisekundu, ktorú si aj tak nikto nevšimne“ Transition na Bubákově příkladě mi žere až 14 % výkonu CPU (Intel i5) při přejetí myší nad tím jediným aktivním prvkem. Díky tvému nápadu bude tento výkon spotřebovávat rejdění myší nad všemi prvky stránky bez ohledu na to, zda se mají vůbec měnit. Pěkně děkuji. |
||
| jefitto44 Profil |
#16 · Zasláno: 30. 6. 2014, 11:14:28
Blbosť... mne to nerobí nič. Teraz som to pozeral
|
||
| juriad Profil |
#17 · Zasláno: 30. 6. 2014, 11:17:25
Mě dokonce z normálních 5-15 % při běžném procházení webu stoupne až na 45-50 % (jedno virtuální jádro na starším Core i7). Omlouvej si to jak chceš, ale pokud ti výrazně klesne výdrž tabletu nebo notebooku při procházení jednoho konkrétního webu, také bys tvůrce rád uškrtil.
Díváš se na vytížení procesu v okamžiku, kdy rejdíš myší přes ten „odkaz“? V klidu to samozřejmě klesne zpět. |
||
|
Časová prodleva: 10 let
|
|||
0