Show Menu
TOPICS×

FlyoutZoomView.highlightmode

[FlyoutZoomView.|<containerId>_flyout.]highlightmode=highlight|cursor[, * showtime *[,onimage|free]]
highlight|cursor
Specifies the type of navigation frame to use. When set to cursor , the component uses a fixed-size reference cursor. It is possible to have different cursor art for desktop systems and touch devices, this is controlled with .s7cursor CSS class and input=mouse|touch attribute selector. On desktop systems, an anchor point is set in the middle of the cursor area, while on touch devices anchor is located in the bottom center of the cursor. When set to highlight , the component uses a variable-size navigation frame; the size and shape of the frame depends on the zoom factor and the size of the flyout view.
showtime
Sets the time (in seconds) it takes the highlight or cursor to fade in after it is activated by the user. Fade in is applied only on touch devices; on desktop systems it is ignored by the component.
Fade in applies to the following UI elements: highlight frame, fixed cursor, overlay (in case overlay parameter is set to 1 ). Flyout view animation begins only after highlight/cursor fade in animation completes. There is no fade out animation. When the user deactivates the flyout, corresponding UI elements (cursor, highlight and overlay) hide instantly.
onimage|free
Controls navigation frame positioning.
If set to onimage the navigation frame can only be positioned inside the actual image area within the main view.
If set to free a user can move the navigation frame anywhere in the logical main view area, even outside image content.

Properties

Optional.

Default

highlight,0.1,onimage

Example

highlightmode=cursor,1,free