Skip to content

Commit

Permalink
Hid backface for all childrn, fixing #31
Browse files Browse the repository at this point in the history
  • Loading branch information
@JemarJones
JemarJones committed Jul 23, 2015
1 parent cfc8dc3 commit 0ac07a7
Showing 1 changed file with 3 additions and 0 deletions.
3 changes: 3 additions & 0 deletions src/flip.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -141,6 +141,9 @@
position: "absolute",
"z-index": "1"
});
faces.find('*').css({
"backface-visibility": "hidden"
});
$dom.find($dom.data("back")).css({
transform: rotateAxis + "(" + (settings.reverse? "180deg" : "-180deg") + ")",
"z-index": "0"
Expand Down

2 comments on commit 0ac07a7

@rockymontana
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Shouldn't this be display: none; instead of backface-visibility?
http://cl.ly/dM7p That's what happens to me :(

But I'll report an issue too...

@Download
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Problem with display:none; is that it becomes a timing issue. There are only two states: front showing and back showing. The flip animation is a transition between these two states.
When the front is showing, the back face could be set to display:none... But when we transition to the flipped state, somewhere in the middle of that transition, the back face will become visible... But when exactly?

backface-visibility is supposed to solve this because the 3D engine within the browser 'knows' the exact frame at which the flip has completed far enough for the back face to be shown.

Please sign in to comment.