The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Css Animation

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
  • #192736

    Hi guys.
    Have some problem in understanding css animation. Have found great example on this site(hover over bookshelf) –
    create a demo but my falling books first goes down and only then fall. If I use hover without transition everything fall nice but very fast. Can somebody explain where is my mistake? Thanks


    @Kuzyo I can see some issues but one main issue that stuck out for me is you are not using any kind of animation delay therefore all your books fall at once try adding -webkit-animation-delay on each item and make each additional item more delayed then the previous. You might also want to throw in some -webkit-translate in with it. ex:





    @scottmarshall993 – be sure to always put in the actual W3C spec property into your code. Just putting in the -webkit prefix won’t help you once it is eventually depreciated.

    In this case though, as you can see from @bearhead, just increasing your animation time is all you need in this instance. It will also give you a more natural animation as in reality all the books will start moving at the same time.


    Thanks guys.

    looks ok, but if we removed cursor from animation all books stay stright up at once (


    here I tried with only one image
    image first goes down and only then lay on the left. Why ?.Can’t uderstand. Appreciate any help

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘CSS’ is closed to new topics and replies.