6個(gè)超炫酷的HTML5電子書翻頁動畫

WebGL 演示網(wǎng)址：http://bookcase.chromeexperiments.com

相信大家一定遇到過一些電子書網(wǎng)站，我們可以通過像看書一樣翻頁來瀏覽電子書的內(nèi)容。今天我們要分享的HTML5應(yīng)用跟電子書翻頁有關(guān)，我們精選出來的6個(gè)電子書翻頁動畫都非常炫酷，而且都提供源碼下載，有需要的朋友可以下載使用。

1、jQuery書本翻頁3D動畫特效

今天要分享的這款jQuery書本翻頁3D動畫功能更加強(qiáng)大，可以支持任意數(shù)量頁的翻閱，并且也有非常美觀的視覺效果。書本的內(nèi)容支持任意HTML元素，相當(dāng)靈活。

在線演示

源碼下載

2、CSS3書本翻頁動畫 書本翻頁效果逼真

今天我們要分享一款炫酷而且實(shí)用的CSS3動畫效果，它是模擬書本翻頁的動畫特效。當(dāng)鼠標(biāo)滑過書本右上角時(shí)，書本即可向前翻一頁，而且翻頁動畫非常逼真。由于CSS3的運(yùn)用，我們并不需要使用復(fù)雜的圖片來制造逼真的書本效果，書本翻頁可以很簡單地完成。

在線演示

源碼下載

3、HTML5電子書翻頁動畫特效

今天我們要來分享一款很酷的HTML5電子書翻頁動畫特效，這款HTML5翻頁動畫可以用鼠標(biāo)拖動頁面來模擬手動翻頁的效果，也可以點(diǎn)擊書頁的邊框來快速翻頁。

在線演示

源碼下載

4、HTML5 3D書本翻頁特效 3D效果比較漂亮

利用HTML5和CSS3實(shí)現(xiàn)3D效果真的非常方便，下面這款書本翻頁特效就很好地利用了HTML5的3D特性。鼠標(biāo)拖拽書本頁面即可翻動頁面，在翻頁的過程中整本書還呈現(xiàn)出3D立體的效果，包括書本中的圖片也十分立體。

在線演示

源碼下載

5、HTML5/CSS3書本翻頁3D動畫

前段時(shí)間我們分享過很多牛叉的HTML5動畫，如果你對HTML5感興趣，可以移步至HTML5動畫欣賞學(xué)習(xí)。今天我們要分享一款基于HTML5和CSS3的書本翻頁3D動畫，當(dāng)我們將鼠標(biāo)滑過書本時(shí)，書本就會自動一頁頁翻過去，書本的3D效果非常不錯(cuò)。

在線演示

源碼下載

6、jQuery/CSS3書本翻頁動畫特效

這是一款基于jQuery和CSS3的書本翻頁動畫特效，該書本翻頁插件的外觀非常華麗喜慶，非常適合產(chǎn)品活動或者育兒網(wǎng)站使用。我們可以點(diǎn)擊左右翻頁按鈕進(jìn)行翻頁，也可以使用鼠標(biāo)拖拽頁腳來實(shí)現(xiàn)翻頁動畫。這是個(gè)jQuery插件，因此兼容性還不錯(cuò)。

在線演示

源碼下載

• 本文固定鏈接:?http://www.i7758.com/archives/2331.html
• 轉(zhuǎn)載:?Yang?2015年12月22日 于?愛七七五八網(wǎng)?發(fā)表

轉(zhuǎn)載于:https://www.cnblogs.com/dahuan/p/10456856.html

總結(jié)

以上是生活随笔為你收集整理的6个超炫酷的HTML5电子书翻页动画【转】的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。