| Autor | Zpráva | ||
|---|---|---|---|
| FrodoZNK Profil |
Zdravím,
vytvořil jsem si jednoduchou slideshow s 5 obrázkama přes keyframes. Všechno funguje, jak má, až na jedinou věc a to je to, že se mi obrázky při přepínání klepají.. Myslel jsem, že je to velikostí, ale i když jsem obrázky zmenšil o polovinu, kdy měly velikost okolo 300px na 100px, klepali se stejně. A další otázka je, proč mi slideshow funguje jen ve Chromu a v Opeře? Mám tam keyframes s prefixem -webkit- pro Chrome, Operu a Safari a pro Firefox s Explorer bez prefixu. Nechápu. :D ŽIVÁ UKÁZKA ZDE Díky moc za rady. :-) |
||
| Bubák Profil |
#2 · Zasláno: 25. 10. 2014, 21:48:53
Podle CSS3 specifikace background-image nepatří mezi animovatelné vlastnosti., webkitové prohlížeče jako jediné background-image animují.
Obrázky, které jsi použil, mají každý jiný rozměr a ty chceš po prohlížeči, aby animoval i background-size na velikost cover, vypadá to, že prohlížeč zaokrouhlí rozměr obrázku nahoru nebo dolů, ale oku to nelahodí. Nejjednodušší bude naštosovat obrázky na sebe a měnit opacity. |
||
| FrodoZNK Profil |
Ořízl jsem všechny obrázky na velikost 1200px x 500px, což je 2x tolik, co mám blok, ve kterém je animaci. No a s
background-size: cover; to funguje. :-) Obrázky sice musím ořezávat, ale aspoň to jde i s větším rozlišením.
Bubák: S tím background-image a animací máš pravdu, dík za radu. :-) KLIK |
||
|
Časová prodleva: 10 let
|
|||
0