css - Bounce animation won't work -
css - Bounce animation won't work -
i'm trying bounce <div>
containing image, won't work , i'm not sure why.
this code:
@keyframes bounce { { left: 0px; } { right: 30px; } } @-moz-keyframes bounce /* firefox */ { { left: 0px; } { right: 30px; } } @-webkit-keyframes bounce /* safari , chrome */ { { left: 0px; } { right: 30px; } } #danielface { background-repeat: no-repeat; width: 145px; height: 165px; background-image: url(../images/daniel/fun.png); animation: bounce 1s; -moz-animation: bounce 1s; /* firefox */ -webkit-animation: bounce 1s; /* safari , chrome */ }
that because of 2 things.
first left
, right
won't object given css. values apply if position
of element other static
(the default).
secondly, conflicting values, not animated effect looking for. saying stretch element, except you've given static width won't. want image on page exactly?
css css3 css-animations
Comments
Post a Comment