Ideme pisat clanok o pokrocilych CSS3 featurach a zacneme uvodom do HTML a CSS pre debilkov. Dava naprosty zmysel.
Firefox podporuje transitions od verzie 4, samozrejme 14 a 15 takisto. Len autor to nevie rozchodit. Jeho neschopnost.
Explorer 10 podporuje animations aj transitions bez prefixu. Ze tomu autor neveri, asi kvoli nejakemu zabudovanemu hate mechanizmu, je zas len jeho problem.
Zdejší geniální spam filtr mi to sem nedovolí vložit, takže odpověď zde.
yep, článek je fajn. Co mne překvapuje je, že si autor netestoval míru podpory ve Firefoxu ESR, tj. aktuálně 10.0.7. Od té doby co se v moz-foundation zblaznili a začali měnit/ničit UI a fce každých pár týdnů, je ESR jasná prioritní volba použitelného browseru pro všechny (nejen) hromadný instalace.
"Pokud chceme css zapisovat přímo do html, musíme jej obalit tagem <style type="text/css"><!-- nejaky css styl --></style>"
takto prosím ne :), prohlížeče, které nepodporují styly a kvůli kterým se stylopis uzavíral do komentářů už snad nikdo nepoužívá, to je zápis pro 90. léta . Navíc prohlížeče mohou vše, co je v komentáři neparsovat a ignorovat.
Můžeš si napsat skript, který všem prvkům na stránce nastaví transition-duration na 0s a animation-play-state na paused. Takový skript může ale citelně zpomalovat načítání stránek. Jinak určitě pomůže vypnout CSS :-D Vzhledem k tomu, že drtivá většina animací je pořád v JS, tak vypnout i JS. Takže pokud ti nejde čistě o texový obsah, tak můžeš rovnou vypnout prohlížeč...
Díky, zatím to řešila rozšíření Flasblock, Adblock plus, Noscript ... Stránky vypadají dobře a nic neotravuje, případné animované obrázky jdou zakázat, JS povoluji jen takové které potřebuji - některé trvale, něco jen dočasně.
Asi zkusím to vypnutí CSS ... Vážně by se ale hodilo rozšíření které podobné ptákoviny vypne.
To je celkem jednoduchý:
- Do FF si nainstaluj Stylish(pro další prohlížeče určitě existuje podobný plugin)
- Restartuj FF
- V levém dolním rohu klepni na ikonku Stylish
- Klepni na "spravovat styly"
- Jako název dej třeba "Vypnout CSS animace"
- Do stylu vlož tohle:
* {
transition-duration: 0s !important;
-webkit-transition-duration: 0s !important;
-moz-transition-duration: 0s !important;
-o-transition-duration: 0s !important;
-ms-transition-duration: 0s !important;
animation-play-state: paused !important;
-webkit-animation-play-state: paused !important;
-moz-animation-play-state: paused !important;
-o-animation-play-state: paused !important;
-ms-animation-play-state: paused !important;
}
- Klepni na "Uložit"
Odteď by se ti na žádné stránce nemělo nic animovat(přesněji nic, co je animováno pomocí CSS3).
Fajn, že se tu na Rootu objevil takový článek, nicméně:
1) základy HTML/CSS bych se nezabýval, začátečník s tím zkratkovitým vysvětlením bude mít stejně problém a navíc si myslím, že nebude studovat zrovna takovýto článek
2) pomocí transition bych animoval pouze číselné vlastnosti (včetně barev)
3) více si zjistit, co kde funguje, ty formulace v článku ve smyslu "nezkoušel jsem" zbytečně shazují důvěru v tento článek
4) co kde zhruba funguje - přehled např. zde: http://caniuse.com/#