Hopiu/jquery-mobile
1
0
Fork 0
mirror of https://github.com/Hopiu/jquery-mobile.git synced 2026-04-09 00:50:58 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fixed 138 - transition: fix flip (and cube?)

Browse source 
- Added a -webkit-perspective property to the body element, since it is the container for the element (ui-page) that actually flips. We need specify this so a projection matrix gets created, giving the viewer some perspective. The 1000 represents the depth in pixels (the distance from the viewer to the z-plane). According to the CSS3 spec 1000 is a moderate value. Lower values make the effect more extreme.
This commit is contained in:
Kin Blas 2010-10-29 13:23:04 -07:00
parent acbec71e29
commit d96ef2ea7d
1 changed files with 10 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
themes/default/jquery.mobile.transitions.css
View file

@ -144,6 +144,16 @@ Built by David Kaneda and maintained by Jonathan Stark.
z-index: 0;
}
/* The properties in this body rule are only necessary for the 'flip' transition.
* We need specify the perspective to create a projection matrix. This will add
* some depth as the element flips. The depth number represents the distance of
* the viewer from the z-plane. According to the CSS3 spec, 1000 is a moderate
* value.
*/
body {
-webkit-perspective: 1000;
}
.flip {
-webkit-animation-duration: .65s;
}