Global

Methods

createPageStrip(viewer) → {HTMLDivElement}

Description:

  • Creates a thumbnail page strip bound to a Riffle viewer.

    The returned element is a div with the class riffle-page-strip, populated with one thumbnail per page as the source loads. Style it by targeting that class — e.g. .riffle-page-strip { display: flex; }. Riffle imposes no layout of its own; you own all styling and placement.

Source:
Parameters:
Name Type Description
viewer RiffleViewer

Viewer element returned by createViewer.
Returns:

The .riffle-page-strip element. Append it wherever you like.

Type
HTMLDivElement

createViewer(optionsopt) → {RiffleViewer}

Description:

  • Creates a Riffle viewer.

    The returned value is a <canvas> element with the viewer API mixed in. Append it to the document and call methods on it directly; Riffle imposes no DOM wrapper or layout styling.

Source:
Parameters:
Name Type Attributes Default Description
options RiffleOptions <optional>
 {}

Viewer options.
Returns:

A canvas element with the public viewer API.

Type
RiffleViewer

Type Definitions

RiffleOptions

Description:
Source:
Properties:
Name Type Attributes Default Description
renderer "auto" | "webgpu" | "2d" | function <optional>
 "auto"

Renderer selection. auto uses WebGPU when available.
source PageSource | null <optional>
 null

Initial page source.
layout Partial.<Layout> | null <optional>
 null

Initial layout overrides.
display Partial.<Display> | null <optional>
 null

Initial display overrides.
paperPreset "natural" | "ivory" | "bright-white" <optional>

Named paper preset.
contentBlendMode string <optional>
 "multiply"

Blend mode for page content.
paperThickness number <optional>

Paper edge and turn-lighting strength from 0 to 1.
showThrough number <optional>
 0.1

Strength of the show-through translucency (adjacent page bleeding through) from 0 (off) to 1.
showPageBorder boolean <optional>
 true

Whether to render the page edge treatment.
maxHighResPages number <optional>
 8

High-resolution page bitmap LRU capacity.
viewport HTMLElement | null <optional>
 null

Element used for zoom measurement and scroll preservation.
selectablePdfText boolean <optional>
 true

Whether to overlay selectable PDF text on settled spreads.
renderScale number <optional>
 1

Pixel supersampling multiplier for the rendered spread canvas.
pdfRenderScale number <optional>
 1.5

Baseline PDF rasterization scale before DPR/zoom.
pdfRenderScaleHeadroom number <optional>
 1.1

Extra PDF rasterization margin above visible size.
pdfMaxRenderScale number <optional>
 0

Maximum PDF rasterization scale; set 0 to disable.
pdfPreviewSourceScale number <optional>
 0.5

Fallback PDF preview rasterization scale when page dimensions are unavailable.

Options for createViewer.

Type:
  • Object