Forums

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

Home Forums CSS rotating object with front- and backside?

  • This topic is empty.
Viewing 1 post (of 1 total)
  • Author
    Posts
  • #243610
    tinkering
    Participant

    Hello!

    I’m trying to adapt a fancy 3-D-thing that is way beyond my knowledge:

    I want to have a kind of a flowing flipside-card with a front and back, that is being rotated through the mouse-movement. It is based on designmodo’s work, shown there: http://designmodo.com/apple-tv-effect/

    My version is much the same, just with my own Layers/images, shown here:

    http://codepen.io/herrbraun/pen/JKroYa

    or, with the graphics: http://davidbraun.ch/parallaxing/

    What must I do to display the backside’s layers when the card is turned?
    I tried
    .VS { transform: translateZ(1px); display: block}
    .BS { transform: translateZ(1px); display: block}

    as well as
    .VS { transform: translateZ(1px); display: block}
    .BS { transform: translateZ(-1px); display: block}

    but the frontside is always in front, the backside only flickers through…

    What must I do? Toggle visibility? (on what condition?)
    I hope I described the problem clearly enough…

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