Expanding image toggles like the one on the right use a small "display version" of the image that the user can click on to display the full version. This can make your topic pages much easier to read because the larger versions of the image are only displayed when needed. Help & Manual does all the work for you. You just select the full-size image you want to display and the smaller version is generated automatically. |
To make an expanding image toggle you just select the image you want to use, choose a zoom factor for the thumbnail display version and enter tooltips and/or captions if you want to use them. 1.Click in your topic in the place where you want to insert your expanding image toggle. Don't select any text (it would be deleted when you insert the image toggle). 2.Select the Insert Toggle tool
See Insert Toggle for details on all the settings in the Insert Toggle dialog. 3.Select the image you want to toggle by clicking on the 4.Select a zoom factor for the preview version and enter tooltips and captions for the expanded and collapsed versions. 5.Click on OK to insert your expanding image toggle. |
You can specify a completely different image for the preview/collapsed state version. For example, you could use a button image that the user clicks on to display a larger image, like this: Just select the Picture: option beneath When collapsed, use different settings... and then select the image you want to use. When you use this option you are completely responsible for the size and appearance of the collapsed state version. Help & Manual will not apply a zoom factor for you. You can enter separate captions and tooltips for the preview and the expanded image. |
You can convert any image in your project into a toggle image. Just right-click on the image and select Picture > Convert Picture to a Toggle... The procedure is then the same as for inserting a new image toggle. |
The CSS class image-toggle is automatically applied to the <img> tag for your image toggles. If you know how to use CSS and HTML you can add style definitions for this class to your HTML template to control the formatting of your toggle image. See Formatting toggles with CSS for details. |
See also: