hs.captionOverlay
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
