framework7

Open full view…

Animation direction on page load

Jure Matoh
Thu, 08 May 2014 09:16:27 GMT

Hi! Just wondering how it would be possible to change the default direction of the load page animation (by default it loads from the right) so that a specific page comes from the bottom.

Vladimir Kharlampidi
Thu, 08 May 2014 10:00:40 GMT

Not by default, but you can just add addional class to page and custom animation rules for it: New page will have additional "page-from-right-to-center" class: --- .page-from-right-to-center { -webkit-animation: pageFromRightToCenter @pageDuration forwards; animation: pageFromRightToCenter @pageDuration forwards; } @-webkit-keyframes pageFromRightToCenter { from { .box-shadow(none); transform: translate3d(100%,0,0); } to { .box-shadow(0 0 12px rgba(0,0,0,0.5)); transform: translate3d(0,0,0); } } @keyframes pageFromRightToCenter { from { .box-shadow(none); transform: translate3d(100%,0,0); } to { .box-shadow(0 0 12px rgba(0,0,0,0.5)); transform: translate3d(0,0,0); } }