你的位置:首页 > 软件开发 > 网页设计 > CSS3——3D翻转相册

CSS3——3D翻转相册

发布时间:2016-08-31 20:00:05
transform属性和transition过渡属性,结合jQuery代码实现翻转功能。 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset= ...

transform属性和transition过渡属性,结合jQuery代码实现翻转功能。

 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4   <meta charset="UTF-8"> 5   <title>3d翻转相册</title> 6   <script src='/images/loading.gif' data-original="jquery-3.0.0.min.js"></script> 7   <style> 8     .container { 9       position: relative; 10       width: 560px; 11       height: 380px; 12       margin: 0 auto; 13     } 14     .items { 15       height: 100%; 16       margin: 100px auto; 17       transform-style: preserve-3d; 18       /*实现自动翻转效果,这里只设置翻转一次*/ 19       animation: autoMove 3s 1 linear; 20       /*点击翻转 过渡效果*/ 21       transition: all 0.5s; 22     } 23     .item { 24       width: 100%; 25       height: 100%; 26       position: absolute; 27       border: 1px solid #c18;

 

海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理:https://www.xlkjsw.com

原标题:CSS3——3D翻转相册

关键词:CSS

CSS
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。