模拟书本翻页效果的JQuery插件turn.js

简介

Turn.js 是一个轻量级的 (15kb) html5页面的jQuery插件，用来创建类似书本和杂志翻页效果，支持触摸屏设备。Turn.js 支持硬件加速来让翻页效果更加平滑。可通过 API 来获取当前显示的页号，并提供选项来定制默认页号、加速器、阴影和延时。

使用

1.  引入 jquery.js 和 turn.js 文件

2.  HTML

<div id="magazine">
  <div style="background-image:url(images/01.jpg);"></div>
  <div style="background-image:url(images/02.jpg);"></div>
  <div style="background-image:url(images/03.jpg);"></div>
  <div style="background-image:url(images/04.jpg);"></div>
  <div style="background-image:url(images/05.jpg);"></div>
  <div style="background-image:url(images/06.jpg);"></div>
</div>

3.  调用

<script type="text/javascript">
  $('#magazine').turn({width: 612, height: 400, acceleration: true});
</script>

相关链接

官网地址 ：http://www.turnjs.com/

在线演示地址：https://www.jq22.com/yanshi2534