菜鸟笔记

Menu

用CSS3实现图书3D变换动画效果

在网上瞎逛的时候发现的一个东西,这个网站也是我经常去的,每次都能看到让我觉得意外的东西。CSS3的妙用真的是太惊奇了,可以实现几乎和flash毫无差异的动画效果。我第一时间想到的就是把它分享给大家,让大家也能感受下CSS3的特性!

它有精装和平装两个效果,我们可以在里面学到一些CSS 3D 转换和过渡的技巧。

精装书

AnimatedBooks1
精装书分为3个部分:封面、书脊和书页,用伪元素增加了一些厚度。

cubes

平装书

AnimatedBooks_02

相比之下,平装就比精装要简约一点,没有阴影的效果,类似于扁平化的风格。

原文地址:http://tympanus.net/codrops/2013/07/11/animated-books-with-css-3d-transforms/

预览地址 下载地址

— 于 共写了315个字
— 文内使用到的标签:

9条回应:“用CSS3实现图书3D变换动画效果”

  1. QQ魔法师说道:

    CSS都可以实现3D效果?厉害啊!

  2. 南寻说道:

    这个好玩~

  3. 电脑爱好者说道:

    哇 完全是css3吗 太神奇了…

  4. 哈秀时尚说道:

    这个挺好玩的

  5. 冯杨洋说道:

    这个网站我也知道

  6. 庫比出征说道:

    可以實現裏面有多頁內容嗎?

发表评论

电子邮件地址不会被公开。 必填项已用*标注