Web SDKv1.0.0

layout.pointer

The viewer lays itself out for a pointer as well as a width. 'auto' asks the device through (pointer: coarse) and follows the answer if it changes — a tablet gaining a trackpad, a convertible folded into a slate. The result is published as data-ks-pointer="coarse" or "fine" on the viewer element, and on every dialog, sheet, toast and popover the SDK places outside it, so one rule reaches them all. Like data-ks-size, it is a supported styling hook.

Pin 'coarse' to see the touch layout without a touchscreen. 'fine' is for the other case: a kiosk with a touchscreen that is driven by a mouse. On a coarse pointer every field the SDK draws is at least 16px, so iOS does not zoom the page when one is focused; fields on the page itself keep the size the PDF gives them.

'auto' | 'fine' | 'coarse'default 'auto'

Values

  • 'auto'Default. Ask the device, and follow the answer if it changes.
  • 'coarse'The touch layout: 44px targets, no hover-only controls, 16px fields.
  • 'fine'The mouse layout, for a touchscreen driven by a mouse.

Example

pointerTypeScript
// Everything a phone would get — 44px targets, no hover-only controls,
// 16px fields — on a desktop, for checking a design.
new PDFViewer(container, doc, { layout: { pointer: 'coarse' } });

More in Layout