Adobe Help Doc available here.

Basically, you insert an AP Div (or a plain old div, doesn't matter) to hold the larger image .. in this case an AP div named: apDiv1

You need to give the thumbnail a null link, that is: javascript:; and then apply the Set Text Behaviour to the <a> attribute. With this demo I've used the 'onmouseover' behaviour, but you can as easily use 'onclick'.

  1. Select the thumbnail image you want to attach the behaviour to.
  2. From the Behaviours Panel, select Set Text > Set Text of Container.
  3. Select the div container that will hold the larger image, in this case apDiv1.
  4. In the dialogue box, using html code, you type in the path to the large image to be viewed - in this example:
  5. <img src=images/bicheno-1-large.jpg width="600" height="450">
  6. Ensure that you insert the correct path to the image, otherwise it will not show on mouseover when previewing in browser.
  7. You can even add a caption in the dialogue box when setting up the behaviour, like so:
  8. <img src=images/bicheno-1-large.jpg width="600" height="450"><p>Caption: This is a picture of Bicheno Blow Hole</p>

Mouseover thumbnail to see larger image and caption