Flipbook（書頁）或者頁面翻轉已成為在網頁設計中最流行的交互動畫之一。他們可以用在 Flash，網頁或者在線雜志中。除了結合 HTML5 和 CSS3 可以實現這樣的動畫外，也有很多優秀的插件可以幫助你。這篇文章給大家推薦1款最好的 jQuery 書頁翻轉（Flipbook）插件。

　　Flipbooks（書頁）或者頁面翻轉已成為在網頁設計中最流行的交互動畫之一。他們可以用在 Flash，網頁或者在線雜志中。使用書頁動畫或者頁面翻轉的網頁設計效果方便人們展示他們的產品，作品或者其它內容，更加醒目和直觀有效。

　　除了結合 HTML5 和 CSS3 可以實現這樣的動畫，也有很多優秀的插件可以幫助你。下面給大家推薦12款最好的 jQuery 書頁翻轉（Flipbook）插件。

  

1. Turn.js

Turn.js 是一個 JavaScript 庫，這將使你的內容看起來像一本真正的書或雜志。Turn.js 是基于 HTML5 的雜志，書籍或目錄的最佳選擇，只有15KB，適用于手機及平板電腦的瀏覽器，利用了硬件加速。

 

2. Flip Page

這個插件用于實現圖像的翻轉效果（2D 體驗的書頁翻轉） 。它利用了 HTML5 & CSS3 硬件加速和，也可以在移動瀏覽器中正常工作。

 

3. jFlip Plugin

這個插件可以讓你把一個圖片庫做成一本書。您可以翻轉書頁來查看下一張或上一張圖片。鼠標懸停在畫廊的上的時候可以點擊或拖動的動態的角落處進行翻頁。

 

4. Flip Counter

flipCounter 是一個 jQuery 插件，讓枯燥的數字顯示變成一個大的，漂亮的翻頁動畫顯示。適合用于倒計時，計數器等等。

 

5. Bookblock

BookBlock 是一個插件，它可用于創建小冊子風格的組件，允許“翻頁”的導航。任何內容都可以使用，如圖像或文本。插件轉換只在需要時使用了一些重疊的影子的頁面來創建更逼真的效果。

 

6. Flip

Flip 是一個 jQuery 插件，讓你可以很容易的在四個方向翻轉你的元素。允許您定義要翻轉你的內容的方向，你也可以定義背景顏色，動畫的速度，并且它還支持 onAnimation 和 OnEnd 動畫中的給定時間的動畫執行。

 

7. Booklet

小冊子可能是這些插件中選項最多的一個，因為它允許配置每個變量。頁面可以手動打開，通過鍵盤，可以前后鏈接切換或者自動播放。

 

8. Portfolio Flipping Slider

這個翻轉滑塊插件非常適合用于個人作品集的展示，這種翻轉效果是通過在用戶點擊分頁觸發的。因此當用戶點擊作品集中的圖像時，圖片會翻轉360度，當其動畫近端影像會以全新的姿態改變。

 

9. imBookFlip

imBookFlip 插件可以把一個 iframe 或直接在頁面上顯示的內容變成書本效果。它的頁面可以設置為打開時，手動點擊或作為自動播放，遺憾的是不支持頁面拖動。此外，它的 API 允許直接指向所需的頁面。

 

10. Flippy

Flippy 是一個輕量級的跨瀏覽器的 jQuery 翻頁效果插件，它可以讓你翻轉你想要的任何 HTML 元素，值得一試。

 

11. QucikFlip2

QuickFlip 工作原理是利用動畫的快捷方式迅速翻轉 。同時允許翻頁效果平滑地與任何一塊標記，無論圖像，背景或 CSS，此快捷鍵可以提高性能。

 

12. jQuery Notebook Page Flip Animation

這款奇特的 jQuery 筆記本外觀使用一個叫做 jQuery Booklet 的 jQuery 動畫插件來實現逼真的書本效果。

 

本文鏈接：12 Best jQuery Flipbook Plugins for Developer

編譯來源：夢想天空 ◆ 關注前端開發技術 ◆ 分享網頁設計資源