Diskuze: Problém s animací

Člen

:8.12.2013 9:08

Zdravím, mám takový problém s animací, kterou jsem si vytvořil v css. Funguje mi bez problému na prohlížeči Chrome a Opera, ale u mozzily a exploreru ne. Prefixy v kódu mám.
Kód:
#animace {
background: url('obrazky/animace2.png') no-repeat center center, url('obrazky/pozadi1.png');
height: 600px;
animation: animace 6s 0;
-moz-animation: animace 6s 0;
-webkit-animation: animace 6s 0;
-o-animation: animace 6s 0;
}

@keyframes animace {
0% {background: url('obrazky/pozadi1.png') no-repeat center center, url('obrazky/pozadi1.png');}
33% {background: url('obrazky/animace1.png') no-repeat center center, url('obrazky/pozadi1.png');}
66% {background: url('obrazky/pozadi1.png') no-repeat center center, url('obrazky/pozadi1.png');}
100% {background: url('obrazky/animace2.png') no-repeat center center, url('obrazky/pozadi1.png');}
}

@-moz-keyframes animace {
0% {background: url('obrazky/pozadi1.png') no-repeat center center, url('obrazky/pozadi1.png');}
33% {background: url('obrazky/animace1.png') no-repeat center center, url('obrazky/pozadi1.png');}
66% {background: url('obrazky/pozadi1.png') no-repeat center center, url('obrazky/pozadi1.png');}
100% {background: url('obrazky/animace2.png') no-repeat center center, url('obrazky/pozadi1.png');}
}

@-webkit-keyframes animace {
0% {background: url('obrazky/pozadi1.png') no-repeat center center, url('obrazky/pozadi1.png');}
33% {background: url('obrazky/animace1.png') no-repeat center center, url('obrazky/pozadi1.png');}
66% {background: url('obrazky/pozadi1.png') no-repeat center center, url('obrazky/pozadi1.png');}
100% {background: url('obrazky/animace2.png') no-repeat center center, url('obrazky/pozadi1.png');}
}

@-o-keyframes animace {
0% {background: url('obrazky/pozadi1.png') no-repeat center center, url('obrazky/pozadi1.png');}
33% {background: url('obrazky/animace1.png') no-repeat center center, url('obrazky/pozadi1.png');}
66% {background: url('obrazky/pozadi1.png') no-repeat center center, url('obrazky/pozadi1.png');}
100% {background: url('obrazky/animace2.png') no-repeat center center, url('obrazky/pozadi1.png');}
}

Odpovědět

8.12.2013 9:08

Honza Bittner

Tvůrce

Honza Bittner:8.12.2013 9:30

A proč tam máš animation: animace 6s 0; ?

Obvykle se to dává ve stylu animation: animace 6s linear; nebo nějaký jiný údaj jak se má animace provést...

Nahoru Odpovědět

8.12.2013 9:30

FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.

Člen

:8.12.2013 9:37

Tu nulu mám nastavený počet opakování.

Nahoru Odpovědět

8.12.2013 9:37

Honza Bittner

Tvůrce

Honza Bittner:8.12.2013 9:43

Aha

Zkus zadat k #animace třeba i šířku ....
Jinak by to ale mělo fungovat... Máš aktuální firefox?

Nahoru Odpovědět

8.12.2013 9:43

FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.

Člen

:8.12.2013 9:49

Mám aktuální a s šířkou jsem to teda zkusil, ale nezabralo to.:/

Nahoru Odpovědět

8.12.2013 9:49

Honza Bittner

Tvůrce

Honza Bittner:8.12.2013 9:53

Našel jsem http://stackoverflow.com/…t-in-firefox

Zkus tedy k té 0le dát nějakou jednotku

Nahoru Odpovědět

8.12.2013 9:53

FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.

Honza Bittner

Tvůrce

Honza Bittner:8.12.2013 9:57

Btw stačilo dát do googlu jen firefox css3 animation not working ...
A hned první příspěvek byla odpověď, chce se to začít naučit googlit

Nahoru Odpovědět

8.12.2013 9:57

FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.

Michal Žůrek - misaz

Tvůrce

Michal Žůrek - misaz:8.12.2013 10:29

V CSS3 musíš psát všude jednotku, jedinou vyjimkou (kvůli zpětné kompatibilitě) jsou jednotky velikosti a pozice kde se dá psát nula bez jednotky.

Nahoru Odpovědět

8.12.2013 10:29

Člen

:8.12.2013 19:18

Nezabralo. I když jsem tu nulu dal pryč tak pořád nefunguje, chyba asi nebude v ní.

Nahoru Odpovědět

8.12.2013 19:18

Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 9 zpráv z 9.