Flipbook
PDF and HTML flipbook viewer with page-flip animation. Works standalone or with Strata CSS.
version1.5.2pdfjs-disthtml2canvaspdf-lib
flipbookpdf-viewerpage-flipbook
30.4 KB gzip
3 deps
Updated 3d ago
MIT License
Quick Start
<link rel="stylesheet" href="flipbook.css">
<script src="flipbook.js"></script>
<!-- Zero-config: existing children become pages -->
<div id="book">
<div>Page 1</div>
<div>Page 2</div>
</div>
<script>StrataFlipbook('#book')</script>
Or pass content explicitly:
<div id="book"></div>
<script>
StrataFlipbook('#book', {
content: '.my-pages', // selector, NodeList, or Element[]
preset: 'magazine',
pagination: 'dots',
drag: true,
exportable: true,
sound: { enabled: true },
})
</script>
PDF Viewer
<script>pdfjsLib.GlobalWorkerOptions.workerSrc = '...'</script>
<div id="book"></div>
<script>
StrataFlipbook('#book', { source: 'pdf', content: '/doc.pdf' })
</script>
Presets
notebook (default) · magazine · paperback · hardcover · comic · minimal
Pagination modes
controls (default) · dots · input · thumbnails · none · or array e.g. ['controls', 'dots']
Peer dependencies
| Package | When needed |
|---|---|
pdfjs-dist |
source: 'pdf' |
html2canvas |
Export HTML source to PDF |
pdf-lib |
Any PDF export |
All MIT or Apache-2.0. None inject inline styles or JS.
See CLAUDE.md for full API reference.
License
MIT © Aftab Ibrahim Kazi