Highslide JS API Reference

Close Move
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam dapibus leo quis nisl. In lectus. Vivamus consectetuer pede in nisl. Mauris cursus pretium mauris. Suspendisse condimentum mi ac tellus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec sed enim. Ut vel ipsum. Cras consequat velit et justo. Donec mollis, mi at tincidunt vehicula, nisl mi luctus risus, quis scelerisque arcu nibh ac nisi. Sed risus. Curabitur urna. Aliquam vitae nisl. Quisque imperdiet semper justo. Pellentesque nonummy pretium tellus.
Resize

Object: hs

Variables

Functions

Events

Object: hs.Expander

Variables

Functions

Events



hs.captionOverlay

Overlay options for the caption, as listed under hs.registerOverlay.
Since version 4.0, the caption and heading are subsets of custom overlays, and overlay options can be applied to them. This means for example that the caption can be placed in all overlay positions like to the right of the image or on top of the image. For a complete list of options, see hs.registerOverlay. All options except overlayId, thumbnailId and slideshowGroup are available.

Details

Requires overlays
Type object
Default value
Overrideable inline Yes

Example

Displaying the caption to the right

Put this code in the head section of your page. This affects all expanders on your page.

<script type="text/javascript">
	hs.captionOverlay.position = "rightpanel";
	hs.captionOverlay.width = "220px";
</script>

Alternatively, to set the options for a single expander, apply the settings in a nested object in the second parameter of hs.expand, like this.

<a class="highslide" href="../samples/full1.jpg" 
		onclick="return hs.expand(this, { captionOverlay: 
		{ position: 'rightpanel', width: '220px'} })">
	<img src="../samples/thumb1.jpg" alt=""/>
</a>

The effect:

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse volutpat. Etiam tellus tortor, sodales eget, tempor eu, suscipit in, odio. Suspendisse nisl urna, faucibus ut, faucibus vitae, rhoncus in, diam. Vivamus pede. Proin scelerisque, ligula in vestibulum mollis, ligula enim interdum mauris, non convallis libero velit rutrum pede. Proin aliquam eros non libero tristique molestie. Cras blandit neque sit amet dolor. Donec condimentum molestie pede. Phasellus risus. Vestibulum dictum vestibulum mi. Vestibulum in justo. Donec vel nunc at pede mollis porttitor. Fusce sit amet pede in sapien dignissim rutrum. Vivamus pede erat, mollis sed, sodales vel, sollicitudin pulvinar, augue. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse volutpat. Etiam tellus tortor, sodales eget, tempor eu, suscipit in, odio. Suspendisse nisl urna, faucibus ut, faucibus vitae, rhoncus in, diam.

See also

New, Edit