您好，是否有可能在HTML5中实现像翻书一样的页面效果？如果可以，该如何实现？
先行致谢！
4个回答
12
这里有另一个使用CSS动画制作的翻页动画，方法基于Roman Cortes原创启发。
构建方式是将每一页右侧嵌套在两个div中。内部div围绕页面上方的旋转点向外旋转30度，使页面进入视线。外部div也围绕同一旋转点旋转15度。它被配置为overflow:hidden并充当内部div页面的剪裁容器。z-indexing用于将页面堆叠在彼此之上。
每一页都覆盖着一个灰色渐进透明度渐变层，在x轴上缩放，因此当页面翻转时，阴影大小会增大或减小。
代码有点复杂，但查看源代码会比较简单。
- Michael Mullany
8
你可以使用jQuery插件实现翻页效果。
以下是jQuery插件的链接。
以下是jQuery插件的链接。
http://plugins.jquery.com/plugin-tags/page-flip
你可以在http://builtbywill.com/code/booklet/找到演示。
希望这能帮到你。
- eHussain
5
你可以使用CSS变换来实现这个效果。
更多信息：http://www.the-art-of-web.com/css/css-animation/ 或者在这里（仅适用于Webkit浏览器）http://www.romancortes.com/blog/pure-css3-page-flip-effect/
更多信息：http://www.the-art-of-web.com/css/css-animation/ 或者在这里（仅适用于Webkit浏览器）http://www.romancortes.com/blog/pure-css3-page-flip-effect/
- LiamB
4
turn.js 是 jQuery 的插件，利用 HTML5 制作出非常逼真的翻页效果。这是一种可爱的效果，而且该插件已经以简单和不苛刻的方式编写，使得实现和配置变得容易。
- Chris Fowler
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接