PDFElement: toolbar property

Value

A string: the effective edge, also when the element inherits it:

"bottom"

Across the bottom edge, its menu above it. This is the default.

"top"

Across the top edge, its menu below it.

"left" or "right"

Upright along the left or the right edge, its menu beside it.

"block-start" or "block-end"

The start or the end of the page's block flow: its top or its bottom, since a page is laid out horizontally.

"inline-start" or "inline-end"

The start or the end of a line: the left or the right edge, and the other way round in a right-to-left page (dir=rtl).

The edge comes from the nearest element that names a valid one, in any case: the page's own, then its file's, then the WebPDF <script>'s. A bare toolbar and other values pass an outer edge on. Setting a string writes it as it is; setting null or "" removes the attribute, so the element inherits again.

The edge only matters while controls is on. To turn the bar off, add the notoolbar token to controlsList: the keys and gestures keep working.

Examples

Moving the bar to the top

HTML

<pdf-file id=f src=//pdf.ist/web.pdf></pdf-file>
<pdf-page of=f controls toolbar=top scale=0.5></pdf-page>

Result

A bar at the end of a line

In a right-to-left page, inline-end is the left edge.

HTML

<pdf-file id=f src=//pdf.ist/web.pdf></pdf-file>
<pdf-page of=f controls toolbar=inline-end dir=rtl scale=0.5></pdf-page>

Result

Keys only

No bar and no gestures: the keyboard still works.

const page = document.querySelector("pdf-page");
page.controlsList.add("notoolbar", "nogestures"); // controlslist="notoolbar nogestures"

Specifications

Not part of any specification. <pdf-file> and <pdf-page> are autonomous custom elements defined by WebPDF.pro.

Browser compatibility

See also

• Viewer controls
• PDFElement.controlsList
• PDFPageElement.controls