zinejs

Examples/Images

Images

A flipbook with multiple images as pages. Expand Options to tweak every constructor setting.

page 1 / … zoom 1.00× renderer webgl2
Options Customize · remounts on change ▾

Defaults match the library. Values marked (default) are omitted from the code snippet below.

Zoom

Covers & page replace

ImageSource

Code

Updates with your options. Only non-default values are included. 

import { Zine, ImageSource } from '@zinejs/core'

new Zine(document.getElementById('book'), {
  source: new ImageSource([
    '/sample-images/page-01.png',
    '/sample-images/page-02.png',
    '/sample-images/page-03.png',
    // ... more pages
  ]),
})

Non-GPU (CSS) renderer: Images example