Comment puis-je utiliser les animations CSS pour glisser une position fixe de l'élément à partir du bas de la page vers le haut?

http://jsfiddle.net/cD4Gr/1/

C'est mon code d'animation:

@-webkit-keyframes silde_to_top {
    0% {
        bottom: 0%;
        top: default;
    }
    100% {
        bottom: default;
        top: 0%;
        z-index: 1000000;
        opacity: 0.5;
    }
}

#test{
    -webkit-animation-name: silde_to_top;
    -webkit-animation-duration: 5s;
    -webkit-animation-timing-function: ease;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;
}

actuellement, la div simplement auto-commence par le haut, au lieu de glisser vers le haut. la seule chose qui l'anime est l'opacité.

InformationsquelleAutor NullVoxPopuli | 2011-10-28
  1. 6

    Il ne peut pas animer de un pour cent de la valeur par défaut auto/valeur (ou vice versa). Ce code est qu'il fonctionne, mais il commence à l'écran: 

    @-webkit-keyframes silde_to_top {
  0% {
    top: 100%;
  }
  100% {
    top: 0%;
    z-index: 1000000;
    opacity: 0.5;
  }
}

    Voici votre violon exemple: http://jsfiddle.net/blineberry/cD4Gr/2/

    InformationsquelleAutor Brent