Animation et radial-gradient

Bonjour,

Je bloque sur un truc, je voudrai faire une animation sur un radial-gradient et cela semble impossible !

J'ai essayé ca : (avec -moz mais essayé aussi avec -webkit)

#soleil {
background: -moz-radial-gradient(center top, circle farthest-corner, rgb(255, 255, 64) 0%, rgb(255, 255, 255) 20%);
-moz-animation: moveBg 25s linear infinite alternate;
}
@-moz-keyframes moveBg {
        0% {
                background-position: 100% 0%;
        }
        100% {
                background-position: 0% 0%;
        }
}

Mais ca ne marche pas, j'ai alors essayé ca :

#soleil {
-moz-animation: moveBg 25s linear infinite alternate;
}
@-moz-keyframes moveBg {
        0% {
                background: -moz-radial-gradient(right top, circle farthest-corner, rgb(255, 255, 64) 0%, rgb(255, 255, 255) 20%);
        }
        100% {
                background: -moz-radial-gradient(left top, circle farthest-corner, rgb(255, 255, 64) 0%, rgb(255, 255, 255) 20%);
        }
}

Mais ce n'est pas mieux. Si j'ai bien compris, radial-gradient se comporte comme si il créait une image ... on devrai donc pouvoir y mettre une animation ?
Modifié par Nicolas-Asso (22 Apr 2012 - 13:06)

Re,

Je me répond, j'ai trouvé la solution

Comme background-position ne fonctionne pas, j'ai mis le radial-gradient dans un DIV que je fait animer de droite à gauche en modifiant les margin

@-moz-keyframes moveBg {
        from {
                margin: 0 0 0 50%;
        }

        to {
                margin: 0 0 0 -50%;
        }
}

Et voilà j'ai un beau levé et couché de soleil
Modifié par Nicolas-Asso (22 Apr 2012 - 15:47)