jquery的與現代網路技術相結合，可以創造奇蹟，它可以用來實現大多數的逼真的效果。在大部分時間中，來自現實世界的例子影響著web開發人員的靈感。而像書一樣翻頁效果是一種非常流行的web開發技術。
這裡介紹 6 個實現翻書效果的 jquery 外掛程式。
turn.js 是乙個輕量級的 (15kb) jquery/html5 外掛程式用來建立類似書本和雜誌翻頁效果，支援觸控螢幕裝置。
turn.js 支援硬體加速來讓翻頁效果更加平滑。
可通過 api 來獲取當前顯示的頁號，並提供選項來定製預設頁號、加速器、陰影和延時。
booklet可能是擁有最多選項的外掛程式。你可以通過鍵盤，鏈結，或者定時自動翻頁。每一頁都有乙個單獨的url，可以被收藏。
bookblock是乙個jquery外掛程式，用於建立乙個頁面翻轉的導航布局的書效果。該外掛程式可用於任何型別的內容，如文字或影象翻轉。
jflip 是乙個基於 jquery 實現的翻頁特效，可瀏覽上下頁和進行拖放操作。
notebook page flip 是乙個定製的 jquery 翻書外掛程式。
imbookflip 外掛程式通過 iframe 或者直接在頁面上呈現圖書效果，可自動翻頁。
imbookflip
Unity Shader實現翻書效果
這裡就隨便用的一張紋理了，我們還是稱為 翻木板 吧，哈哈。實現過程 其實這個效果實現起來還是挺簡單的，大概思路其實就是讓所有頂點都繞z軸旋轉，並且通過正余弦使之帶有一點弧度。下面開始讓我們一步一步的實現該效果。首先開啟unity新建乙個工程，場景，並且建立乙個名為openbookeffect的sha...
CSS3 實現翻書效果
body ulul li一般3d層給實現3d效果的父盒子，視距給最大的盒子body。在給子元素設定旋轉角度過程中，使用偽類選擇器可以減少記憶體的占用，這裡使用到 nth child 偽類。主要css 如下 ul hover li nth child 1 ul hover li nth child 2...
ul li 3 實現翻書動畫效果
按慣例，上gif 重現 codepen.io anon pen jj 這是我今天參加面試時候，面試官讓我做的一道題，面試官坐我旁邊看我現場做，然而我比較菜，回來後才做出來 來看看html部分 由於li是inline block元素，所有沒有寫li的閉合，寫了的話每個li之間會有4px的間距，不寫瀏覽...