epub.js制作电子书阅读网站

使用epub.js制作一个在线阅读网站

欢迎使用

效果展示:https://zuowb.cn/(欢迎收藏使用)

所用技术

vue2.0,epub.js,IndexDB,webpack14.0

epub.js介绍

gittub地址:https://github.com/futurepress/epub.js
官方文档:http://epubjs.org/documentation/0.3/
获取epub.js

npm install epub.js

在项目中导入对应库

import ePub from 'epubjs'

基础 方法:

//首先获取book对象
//使用文件地址导入
var book = ePub('/book/xxx.epub')
//或者使用ArrayBuffer导入
//var book = ePub(arrayBuffer)

//绑定到页面上对应id的元素上如<div id='readHere'>   </div>
var rendition = book.renderTo('readHere',{
   
width:'100%',   //也可以是'980px'这样的
height:'100%',
flow:'paginated'   //默认是'paginated',是分页模式,'scrolled-doc'是滚动式
})//其它参数具体可以参考官方文档

//渲染到页面上
rendition.display()  //显示第一页 //现在可以看到页面上显示书籍了

//实现翻页
rendition.prev()  //下一页
rendition.next() //上一页     //现在可以一口气将一本书从头看到尾了

//获取目录对象
book.ready.then(()=>{
   
var catalog = that.navigation.toc    //获得一个对象数组,包含每一章节题目和跳转地址。
return book.locations.generate()     //返回一个全书的解析,包括cfi与percentage的详细对应信息
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值