在这里,你会发现15的jQuery的翻页书的插件,提供了良好的页面翻转的经验,并帮助创建类似书本的效果。 jQuery的增添了一道亮丽的过渡到实际的页面在一本书或杂志HTML5。

1. BookBlock: jQuery内容翻转插件

BookBlock是可以将任何内容,如图像或文本创建小册子的组件,允许一个“翻页”的导航。

在线演示

2. imBookFlip : jQuery Page Turning Plugin without Flash

imBookFlip可以将iframe加载书本成本效果在页面上显示。此插件可以设置为手动点击打开时或自动旋转。声音管理器可以使用jQuery插件添加音频书。

在线演示

3. jQuery flip book image gallery plugin : jFlip

jQuery的翻转书的图片库插件将图片制作成书,单击或拖动动画的角落悬停时显示的画廊区,以查看下一个或前一个图像。

在线演示

4. turn.js – jQuery HTML5 Page Flip effect plugin

jQuery的HTML5页面翻转效果插件,实现了HTML5美丽的过渡效果。

在线演示

5. Creating a jQuery Flipbook Image Slider with CSS3 3D Transforms

创建一个jQuery的连环画与CSS3 3D变换的图像滑块

在线演示

6. jQuery Responsive FlipBook v5

jQuery的响应式书本效果(支持iPad等)


在线演示

7. jQuery Fullscreen Pageflip Layout

BookBlock创建一个全屏书本布局。我们的想法是像书页从左侧滑出翻转的内容和访问的页面通过工具栏菜单中。

在线演示

8. Moleskine Notebook with jQuery flip page Booklet

我们将向您展示如何使用和自定义的辉煌的jQuery的小册子插件有才华的Grauvogel。

在线演示

9. Bookflip : JavaScript Page Turn effects

JavaScript的翻页效果,已经完全重建Bookflip引擎更好的支持IE8及9。

在线演示

10. jQuery flipbook layout plugin : Booklet

jQuery的的连环画布局插件


在线演示

11. jPageFlipper : jQuery HTML5 Canvas page flipper

基于HTML 5 canvas实现翻书效果

在线演示

12. jQuery Flipbook Slider

jQuery的连环画Slider是一个轻量级的jQuery插件翻页效果。它可以用于任何内容:文本,HTML页框,视频,Flash(SWF)等,您可以很容易地对其进行自定义与CSS(背景图片,字体,颜色等)。

在线演示

13. jQuery Experimental PageFlip Layout Inspired by Flipboard

我们想与大家分享一个实验性的3D布局。它的灵感来自著名的Flipboard的应用程序无缝“正常”的一本书像一个页面,在页面翻转时刷卡。支持触屏及拖动。

在线演示

14. jQuery Flippage: Turn pages of your DIVs

层翻转效果

在线演示

15. WowBook – jQuery Flip book engine

WowBook​​是jQuery插件,它允许你创建一个在线出版物(如书或杂志)与2个不同的翻页效果。


在线演示

via:jqueryrain

15个最佳jQuery的翻页书效果的例子的更多相关文章

  1. 15 个最佳 jQuery 翻书效果插件

    本文为你带来15个非常实用的.实现类似翻书效果的jQuery插件,你可以很容易地整合到你的web应用中,提升用户体验. 1.  BookBlock BookBlock可以将任何内容(如图像.文本)创建 ...

  2. jquery css3问卷答题卡翻页动画效果

    这个选项调查的特效以选项卡的形式,每答完一道题目自动切换到下一条,颇具特色.使用jQuery和CSS3,适合HTML5浏览器. 效果展示 http://hovertree.com/texiao/jqu ...

  3. jquery 实现智能炫酷的翻页相册效果

    jquery 实现智能炫酷的翻页相册效果巧妙的运用 Html 的文档属性,大大减少jquery 的代码量,实现了智能炫酷的翻页相册.兼容性很好,实现了代码与标签的完全分离​1. [代码]jquery ...

  4. 3D版翻页公告效果

    代码地址如下:http://www.demodashi.com/demo/12830.html 前言: 在逛小程序蘑菇街的时候,看到一个2D版滚动的翻页公告效果.其实看到这个效果的时候,一点都不觉得稀 ...

  5. 创意HTML5文字特效 类似翻页的效果

    原文:创意HTML5文字特效 类似翻页的效果 之前在网上看到一款比较有新意的HTML5文字特效,文字效果是当鼠标滑过是出现翻开折叠的效果,类似书本翻页.于是我兴致勃勃的点开源码看了一下,发现其实实现也 ...

  6. Android 聊天表情输入、表情翻页带效果、下拉刷新聊天记录

    经过一个星期的折腾,最终做完了这个Android 聊天表情输入.表情翻页带效果.下拉刷新聊天记录.这仅仅是一个单独聊天表情的输入,以及聊天的效果实现.由于我没有写server,所以没有两方聊天的效果. ...

  7. Atitit.列表页面and条件查询的实现最佳实践(2)------翻页 分页 控件的实现java .net php

    )------翻页 分页 控件的实现java .net php 1. 关于翻页有关的几大控件::搜索框控件,显示表格控件,翻页器,数据源控件.. 1 2. 翻页的显示格式:: 1 2.1. 通常ui- ...

  8. jq小demo—图片翻页展示效果 animate()动画

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

  9. jq demo—图片翻页展示效果 animate()动画

    <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...

随机推荐

  1. build path contains duplicate entry:'src' for project 'XXX'

    解决了,原因是编译器配置不正确,原工程使用adk8/android2.3,我用的是最新的4.0,改了下编译环境就好了.

  2. 使用queryperf对DNS服务器作压力测试

    一.querperf简介 当我们把DNS服务器配置好后,我们肯定会想测试一下DNS服务器的性能如何,上线后如果请求数够多服务器还能否响应?于是,我们可以使用软件模拟环境,对DNS服务器作评估性的测试. ...

  3. UICollectionView之自定义Layout

    #import <UIKit/UIKit.h> @interface WQViewController : UIViewController - (id)initWithFrame:(CG ...

  4. asp.net html table to DataTable

    添加引用 http://htmlagilitypack.codeplex.com/downloads/get/437941 protected void Export(string content,s ...

  5. Django 分页功能

    Django 分页功能比较强大,这边是结合官网的内容写的可以参考 https://docs.djangoproject.com/en/1.9/topics/pagination/ 分页命令行练习案列 ...

  6. TP4056大电流1A使用注意事项

    源:TP4056大电流1A使用注意事项 TP4056为南京拓微集成电路有限公司推出的锂电池充电产品系列中的大电流充电产品.具有最大电流1A,峰值电流1.1A,良好环境下甚至峰值1.2A的单节锂离子电池 ...

  7. 转:SSH原理与运用(二):远程操作与端口转发

    作者:阮一峰 (Image credit: Tony Narlock) 七.远程操作 SSH不仅可以用于远程主机登录,还可以直接在远程主机上执行操作. 上一节的操作,就是一个例子: $ ssh use ...

  8. windows下编译Android版本的boost库文件

    1.起因: 手上有一个用到了boost的asio库和thread库的工程要编译到手机上(Android版本和ios版本),本文只介绍如何编译到Android版本,ios版本之后再介绍,也许就不介绍了( ...

  9. dos命令(Cacls和Icacls) -- 显示或者修改文件的访问控制表

    1. dos帮助说明 cacls /? 注意: 不推荐使用 Cacls,请使用 Icacls. 显示或者修改文件的访问控制列表(ACL) CACLS filename [/T] [/M] [/L] [ ...

  10. ignite中的消息使用实例

    消息很简单,跟其他的mq相仿,关键点: 一,添加监听,订阅主题 二,发送消息 写了一个简单的示例: Receiver.java package test.ignite.broadcast; impor ...