婚礼邀请函上海版源码
婚礼邀请函源码,只上传了上海版。做的比较粗糙,动画都是用css3书写的,假如有需要,可以借鉴一下,注意,视频和图片不要用我的哦!有版权,严禁用于除学习之外的其他任何用途。
perspective 动画透视效果
透视效果是近大远小,我的邀请函中,图片垂直翻转效果,用到了perspective 。让图片透视旋转。
@-webkit-keyframes rotater {
0% {
-webkit-transform: perspective(1200px) rotateY(-120deg);
transform: perspective(1200px) rotateY(-120deg);
}
100% {
-webkit-transform:perspective(800px) rotateY(180deg);
transform:perspective(800px) rotateY(180deg);
}
}
@keyframes rotater {
0% {
-webkit-transform: perspective(1200px) rotateY(-120deg);
transform: perspective(1200px) rotateY(-120deg);
}
100% {
-webkit-transform:perspective(800px) rotateY(180deg);
transform:perspective(800px) rotateY(180deg);
}
}
perspective()可以指定透视距离,值越小,显示越大,离你越近。
关于邀请函用到的知识点
请看文章http://www.haorooms.com/post/h5_animation_zj
有些知识点后来删掉了,例如font face特殊字体的应用