wowbook是一个jQuery插件,可以让你在网站中发布一本页面翻转效果超赞的书。

demo演示

基本页面

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>wow_book</title>
  6. <link rel="stylesheet" href="css/wow_book.css" type="text/css" />
  7. </head>
  8. <body>
  9. <div id="mybook">
  10. <div>书本封面</div>
  11. <div>内容页面1</div>
  12. <div>内容页面2</div>
  13. <div>内容页面3</div>
  14. <div>内容页面4</div>
  15. <div>书本封底</div>
  16. </div>
  17.  
  18. <script type="text/javascript" src="js/jquery.min.js"></script>
  19. <script type="text/javascript" src="js/wow_book.min.js"></script>
  20. <script type="text/javascript">
  21. $(document).ready(function() {
  22. $('#mybook').wowBook({
  23. width : 600,
  24. height : 500
  25. });
  26. });
  27. </script>
  28. </body>
  29. </html>

使用实例

特征

可以渲染PDF文件,通过安装PDF.js库
单页模式
支持移动端,可响应的单页模式
封面比内容页大
带有字体图标的工具栏
目录
Lightbox
lazy loading
鼠标悬浮可显示翻页角
自动化的缩略图
支持从右向左翻页
2种逼真的翻页效果,包括精装的硬封面和普通纸翻页效果
支持所有主流浏览器
不需要flash
使用简单:使用HTML和CSS制作内容
响应式
支持触控(包括捏放大)
全屏
双页
无封面和封底
Deeplinking
链接可跳转到书中的任意页面和元素
缩放
支持浏览器的后退按钮
可循环的幻灯片效果
可配置的键盘导航
可配置的鼠标滚轮导航
API文档
在支持audio标签的浏览器上可以播放翻页声音
自动化的页码编号
可将页面缩略图转成sprite的工具

参考:
  官方文档

翻书插件:wowbook.js的更多相关文章

  1. 翻书插件:bookblock.js

    BookBlock 是一个 jQuery插件,用来制作带有翻页效果的小书册.可以用任何形式的内容,比如图像或文本.插件会在翻页时利用变形模拟手工翻页,并产生重叠的阴影以达到更逼真的效果. 基本页面 & ...

  2. 移动端翻页插件dropload.js(支持Zepto和jQuery)

    一. 声明 代码来源:github上的dropload项目. 二. 问题 dropload.js提供了最基本的上拉翻页,下拉刷新功能.对于由服务端一次返回所有数据的情况基本通用. 但是,需求往往不是服 ...

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

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

  4. jQuery+turn.js翻书、文档和杂志3种特效演示

    很好用的一款插件jQuery+turn.js翻书.文档和杂志3种特效演示 在线预览 下载地址 实例代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML ...

  5. turn.js实现翻书效果

    JS插件网 http://www.ijquery.cn/?p=173 描述:Turn.js 是一个轻量级的 (15kb) jQuery/html5 插件用来创建类似书本和杂志翻页效果,支持触摸屏设备. ...

  6. JQuery的turn.js实现翻书效果

    前言: hello大家好~好久没更博了……今天来和大家分享下JQ的turn.js,下面我先来简单介绍下我们今天的主角turn.js. Turn.js是一个JavaScript库,它集合了HTML5的所 ...

  7. Unity3d:megaFierstext(翻书效果插件)

    附件中是一款翻书效果插件,由于附件上传大小限制,在下载完后,需要在megaFierstext_BHYF\Assets\Resources\Textures下添加图片精灵并修改属性为Texture,即可 ...

  8. Turn.js 实现翻书效果的学习与总结

    最近CTO给我分配了一个移动端H5开发的任务,主要功能是需要实现翻书效果,我听过主要需求后,当时是呀!!!接下来自己尝试使用fullPage.js和Swiper来实现翻书效果,结果效果都不是非常的理想 ...

  9. 【原创】jQuery插件 - Booklet翻书特效教程(一) 一般设置

    jQuery插件 - Booklet翻书特效教程(一) 一般设置 本文由五月雨恋提供,转载请注明出处. 一.宽高(width/height) 1.自定义大小 $(function(){ // 自定义页 ...

随机推荐

  1. scrollToItemAtIndexPath: atScrollPosition: animated:

    oh my god 今天死在scrollToItemAtIndexPath: atScrollPosition: animated:方法上面,scrollPosition这个参数控制cell具体停留在 ...

  2. 获取View的截图-将View转换为Bitmap对象

    开发中,有时候需要获取View的截图来做动画来达到动画流程的目的 原理:将View的内容画到一个Bitmap画布上,然后取出 下面封装了一个从View生成Bitmap的工具类 /** * 将View转 ...

  3. Unity插件之Unity调用C#编译的DLL

    Unity插件分为两种:托管插件(Managed Plugins)和本地插件(Native Plugins).本文先来说说Unity中的托管插件,本地插件的文章留到下一篇文章再说. 有时候我们会有这样 ...

  4. 从零自学Hadoop(21):HBase数据模型相关操作下

    阅读目录 序 变量 数据模型操作 系列索引 本文版权归mephisto和博客园共有,欢迎转载,但须保留此段声明,并给出原文链接,谢谢合作. 文章是哥(mephisto)写的,SourceLink 序 ...

  5. linux几种快速清空文件内容的方法

    linux几种快速清空文件内容的方法 几种快速清空文件内容的方法: $ : > filename #其中的 : 是一个占位符, 不产生任何输出. $ > filename $ echo & ...

  6. tst、cmp、bne、beq指令

    1.tst:逻辑处理指令,用于把一个寄存器的内容和另一个寄存器的内容或立即数进行按位的与运算,并根据运算结果更新CPSR中条件标志位的值.当前运算结果为1,则Z=0:当前运算结果为0,则Z=1 cmp ...

  7. Mybatis

    Mybatis MyBatis本是apache的一个开源项目iBatis,2010年这个项目有Apache software foundation 迁移到了Google code,并改名MyBatis ...

  8. PHP的GD库

    GD库 PHP通过GD库,可以对JPG.PNG.GIF.SWF等图片进行处理.GD库常用在图片加水印,验证码生成等方面. 绘制线条 要对图形进行操作,首先要新建一个画布,通过imagecreatetr ...

  9. [LeetCode] Battleships in a Board 平板上的战船

    Given an 2D board, count how many different battleships are in it. The battleships are represented w ...

  10. AppBox_v2.0完整版免费下载,暨AppBox_v3.0正式发布!

    文章更新: AppBox v6.0中实现子页面和父页面的复杂交互 AppBox 是基于 FineUI 的通用权限管理框架,包括用户管理.职称管理.部门管理.角色管理.角色权限管理等模块. AppBox ...