turnjs 4 API DOCUMENTATION

• 语言: 英语
• 格式: .pdf
• 来源: www.turnjs.com

摘要

文档详细介绍了turn.js 4的API功能及其使用方法。包括jQuery插件的构建方式、翻页书的核心特性、DOM元素的使用、页面添加的三种方式、性能优化措施以及浏览器支持情况。文档还新增了多个功能选项，如autoCenter、zoom等，并修复了多个已知问题。同时，介绍了如何通过CSS类和事件处理来控制翻页书的外观和交互。

AI总结

《turn.js 4 API 文档》提供了关于如何使用 `turn.js` 创建翻页书效果的详细说明。以下是文档的核心内容总结：

### 1. **概述**
- `turn.js` 是一个 jQuery 插件，用于创建翻页书效果，支持丰富的功能和用户交互。
- API 包括属性、方法和事件，且 setter 和 getter 方法命名一致。

### 2. **必需条件**
- 需要 jQuery 1.7 或更高版本。

### 3. **浏览器支持**
- 支持的浏览器包括：Safari for iOS、Safari 5、Chrome 11、Chrome for Android、Firefox 9、IE 9 和 IE 8。
- 使用 `turn.html4.js` 以支持 IE 8/7。

### 4. **HTML 准备**
- 可通过三种方式添加页面：
1. 直接在容器中添加 HTML 内容。
2. 动态加载（通过 Ajax 请求获取数据后添加）。
3. 混合方式（部分页面直接添加，部分动态加载）。

### 5. **性能**
- 支持非常长的翻页书，DOM 中仅保留最后 6 页，以节省内存。

### 6. **IE 8/7 支持**
- 使用 `turn.html4.js` 优化支持，建议结合 Modernizr 和 YepNope.js 灵活加载不同版本的脚本。

### 7. **CSS 类**
- 使用 CSS 类定义翻页书的样式，支持自定义页面外观。

### 8. **新功能（4.0 版本）**
- 新增功能包括：
- `autoCenter`：自动居中翻页书。
- `zoom`：缩放功能。
- `animating`：判断翻页动画是否进行中。
- `destroy`：销毁翻页书实例。
- 新增事件：`missing` 和 `zooming`。
- 新增 CSS 类：`.even`、`.fixed`、`.hard`、`.odd`、`.own-size`、`.sheet`。

### 9. **忽略元素**
- 可通过 `ignore` 属性排除某些元素作为页面内容。

### 10. **角落区域**
- 翻页书的交互区域分为多个角落（如 `tl`、`tr`、`bl`、`br` 等），用于定义用户互动的区域。

### 11. **构造函数**
- 使用 `constructor` 方法将容器转换为翻页书：

  $('#flipbook').turn([options]);

- `options` 是可选参数，用于定义翻页书的特性。

### 12. **选项**
- 主要选项包括：
- `acceleration`：硬件加速模式，默认为 `true`。
- `display`：显示模式（`single` 或 `double`）。

### 13. **方法**
- 常用方法：
- `destroy`：销毁翻页书。
- `hasPage`：检查指定页面是否已加载。
- `next`：翻到下一页。
- `is`：检测是否为 `turn.js` 实例。

### 14. **事件**
- 支持自定义事件，用于监听页面交互和状态变化。

### 总结
`turn.js` 是一个功能强大的 jQuery 插件，支持丰富的翻页效果和交互功能，适用于创建电子书、杂志等翻页效果。其核心优势在于灵活性和性能优化，适合需要跨浏览器支持和动态内容加载的场景。