Share via

WinJS.UI.SemanticZoom constructor

  • Article

Creates a new SemanticZoom.

Syntax

var semanticZoom = new WinJS.UI.SemanticZoom(element, options);

Parameters

  • element
    Type: Variant

    The DOM element that hosts the SemanticZoom.

  • options [optional]
    Type: Object

    An object that contains one or more property/value pairs to apply to the new control. This object can contain these properties:

Value Meaning
initiallyZoomedOut Boolean

The initial zoom state of the SemanticZoom object. The default value is true, or zoomed out.
zoomFactor 0.2–0.85

The minimum scaling factor applied to the zoomed out view. The default is 0.65.

When zoomed in, the zoomed in view is set to 100% of its normal size. Similarly, when zoomed out, the zoomed out view is set to 100% of its normal size. However, the two controls are scaled differently relative to one another. For example, if zoomFactor is set to 0.4 the following occurs:

  • When zoomed out, the zoomed in view (currently invisible) is scaled to 40% of its normal size.
  • When zooming in, the zoomed out control and zoomed in control are scaled up simultaneously, and the view crossfades to the zoomed-in control. So, even though roughly only the second half of the scaling animation on the zoomed in control is displayed, it is scaling from 40% up to 100% of its normal size.
  • Conversely when zoomed in, the zoomed out view (currently invisible) is scaled to 250% (1 / 0.4) of its normal size.
  • When zooming out, the zoomed in control and zoomed out control are scaled down simultaneously, and the view crossfades to the zoomed out control. So, even though roughly only the second half of the scaling animation on the zoomed out control is displayed, it is scaling from 250% down to 100% of its normal size.

zoomFactor just determines those two numbers: 0.4 yields 40% and 250%, 0.5 yields 50% and 200%, 0.8 yields 80% and 125%, and so on. If a value outside that range is passed in, it is clipped to the closest value of the range.
 

Requirements

Minimum WinJS version

WinJS 1.0

Namespace

WinJS.UI

See also

SemanticZoom

IZoomableView