Sujet Précédent Sujet Suivant

Probléme d'animation sur firefox

Fermé
stev - 18 mai 2014 à 19:32
 Utilisateur anonyme - 19 mai 2014 à 13:33
Bonjour, j'ai un problème d'animation qui ne s'affiche pas sur firefox :

.hexadecimal{
width: 150px;
height: 220px;
animation: hexad 10s linear 0s infinite;
-moz-animation: hexad 10s linear 0s infinite;
-webkit-animation: hexad 10s linear 0s infinite;
background-size: 100% 100%;
border-radius: 10%;
display: inline-block;
}

@keyframes hexad{
from { background: url("0.jpg"); background-size: 100% 100%;}
6.25% { background: url("0.jpg"); background-size: 100% 100%;}
6.26% {background: url("1.jpg"); background-size: 100% 100%;}
12.5% {background: url("1.jpg"); background-size: 100% 100%;}
12.6% {background: url("2.jpg"); background-size: 100% 100%;}
18.75% {background: url("2.jpg"); background-size: 100% 100%;}
18.76% {background: url("3.jpg"); background-size: 100% 100%;}
25% {background: url("3.jpg"); background-size: 100% 100%;}
25.1% {background: url("4.jpg"); background-size: 100% 100%;}
31.25% {background: url("4.jpg"); background-size: 100% 100%;}
31.26% {background: url("5.jpg"); background-size: 100% 100%;}
37.5% {background: url("5.jpg"); background-size: 100% 100%;}
37.51% {background: url("6.jpg"); background-size: 100% 100%;}
43.75% {background: url("6.jpg"); background-size: 100% 100%;}
43.76% {background: url("7.jpg"); background-size: 100% 100%;}
50% {background: url("7.jpg"); background-size: 100% 100%;}
50.1% {background: url("8.jpg"); background-size: 100% 100%;}
56.25% {background: url("8.jpg"); background-size: 100% 100%;}
56.26% {background: url("9.jpg"); background-size: 100% 100%;}
62.5% {background: url("9.jpg"); background-size: 100% 100%;}
62.51% {background: url("a.jpg"); background-size: 100% 100%;}
68.75% {background: url("a.jpg"); background-size: 100% 100%;}
68.76% {background: url("b.jpg"); background-size: 100% 100%;}
75% {background: url("b.jpg"); background-size: 100% 100%;}
75.1% {background: url("c.jpg"); background-size: 100% 100%;}
81.25% {background: url("c.jpg"); background-size: 100% 100%;}
81.26% {background: url("d.jpg"); background-size: 100% 100%;}
87.5% {background: url("d.jpg"); background-size: 100% 100%;}
87.6% {background: url("e.jpg"); background-size: 100% 100%;}
93.75% {background: url("e.jpg"); background-size: 100% 100%;}
93.76% {background: url("f.jpg"); background-size: 100% 100%;}
to { background: url("f.jpg"); background-size: 100% 100%;}
}

@-moz-keyframes hexad{
from { background: url("0.jpg"); background-size: 100% 100%;}
6.25% { background: url("0.jpg"); background-size: 100% 100%;}
6.26% {background: url("1.jpg"); background-size: 100% 100%;}
12.5% {background: url("1.jpg"); background-size: 100% 100%;}
12.6% {background: url("2.jpg"); background-size: 100% 100%;}
18.75% {background: url("2.jpg"); background-size: 100% 100%;}
18.76% {background: url("3.jpg"); background-size: 100% 100%;}
25% {background: url("3.jpg"); background-size: 100% 100%;}
25.1% {background: url("4.jpg"); background-size: 100% 100%;}
31.25% {background: url("4.jpg"); background-size: 100% 100%;}
31.26% {background: url("5.jpg"); background-size: 100% 100%;}
37.5% {background: url("5.jpg"); background-size: 100% 100%;}
37.51% {background: url("6.jpg"); background-size: 100% 100%;}
43.75% {background: url("6.jpg"); background-size: 100% 100%;}
43.76% {background: url("7.jpg"); background-size: 100% 100%;}
50% {background: url("7.jpg"); background-size: 100% 100%;}
50.1% {background: url("8.jpg"); background-size: 100% 100%;}
56.25% {background: url("8.jpg"); background-size: 100% 100%;}
56.26% {background: url("9.jpg"); background-size: 100% 100%;}
62.5% {background: url("9.jpg"); background-size: 100% 100%;}
62.51% {background: url("a.jpg"); background-size: 100% 100%;}
68.75% {background: url("a.jpg"); background-size: 100% 100%;}
68.76% {background: url("b.jpg"); background-size: 100% 100%;}
75% {background: url("b.jpg"); background-size: 100% 100%;}
75.1% {background: url("c.jpg"); background-size: 100% 100%;}
81.25% {background: url("c.jpg"); background-size: 100% 100%;}
81.26% {background: url("d.jpg"); background-size: 100% 100%;}
87.5% {background: url("d.jpg"); background-size: 100% 100%;}
87.6% {background: url("e.jpg"); background-size: 100% 100%;}
93.75% {background: url("e.jpg"); background-size: 100% 100%;}
93.76% {background: url("f.jpg"); background-size: 100% 100%;}
to { background: url("f.jpg"); background-size: 100% 100%;}
}

Si vous savez quel est mon erreur merci de me répondre ^^.
A voir également:

4 réponses

Réponse 1 / 4
stev
18 mai 2014 à 20:04
La réinstallation de firefox ne change rien, j'ai plusieurs animations sur mon site et seuls les animations qui modifie le background ne marche pas sur firefox... C'est vraiment bizarre ..
0
Réponse 2 / 4
Utilisateur anonyme
18 mai 2014 à 20:20
Salut, essaye de changer tes background par background-image

bonne soirée
0
animostab Messages postés 2829 Date d'inscription jeudi 10 mars 2005 Statut Membre Dernière intervention 11 novembre 2019 738
19 mai 2014 à 13:22
@lobotoFix
@keyframes ne peux pas changer une image de background en une autre
0
Utilisateur anonyme
19 mai 2014 à 13:33
ok...désolé :)
0
Réponse 3 / 4
animostab Messages postés 2829 Date d'inscription jeudi 10 mars 2005 Statut Membre Dernière intervention 11 novembre 2019 738
Modifié par animostab le 19/05/2014 à 13:33
Salut
@keyframes ne peux pas switcher des images de background, donc la ton code est "futuriste" (peux être un jour ce sera possible mais pour l'heure: non.)

ce que tu peux faire c'est mettre toutes les images en une seule (les unes à la suite des autres) et animer comme un sprite.

sinon tu devras faire un diaporama genre jquery

autre chose ne mets pas de double quotes dans le parenthèse url
ex url(image1.jpg);

Un petit merci vaut mieux qu'une grande ignorance !
Donc si votre sujet est résolu une réponse avec merci c'est pas de refus.
0
Réponse 4 / 4
monday1999 Messages postés 556 Date d'inscription dimanche 22 avril 2012 Statut Membre Dernière intervention 20 février 2016 80
18 mai 2014 à 19:49
Bonjour, réinstallez Firefox et verifiez vos Plugin
-1
monday1999 Messages postés 556 Date d'inscription dimanche 22 avril 2012 Statut Membre Dernière intervention 20 février 2016 80
18 mai 2014 à 19:50
Re-téléchargez le en cliquant sur "Firefox"
0

Discussions similaires

comment animer une soirée avec 30 personnes à table ?
sofi -
Nolly94 -

1 réponse
Méssage Firefox ''Couldn't load XPCOM''
pistouri -
pistouri -

0 réponse
Comment retrouver mes favoris Firefox dans mon disque dur?
Mathieu1221 -
ERG -

10 réponses
Idées de jeux rigolos pour un anniversaire
gromuss -
gigi -

9 réponses
Problème de téléchargement de firefox mozilla
Source2Vie18 -
fabul -

1 réponse