Rollover (Beethoven), or Dis Joint the image, eight to the bar

Rick asks, "how can I roll over something and have an image pop up elsewhere on the page?" Look at http://www.paeweb.org/students/DWCS4/disjointTest.html

1. Begin with your images optimized to two sizes: a thumbnail and a full-sized image. I have not optimized OR sized any of the images in this example; you may also want to play around with sizes before you do final sizing.
   
2. Make an APdiv (or other image 'placement') and insert your "resting" image...the image that will show when you are not mousing over the thumbnails. You need not use an APdiv. Any image anywhere on the page can be "swapped" out and in. Just watch the dimensions of the image and make sure it acts the way you want it to!
   
3. Make sure each image on the page is named, including the "resting" image.
4. Turn on the Behaviors panel from the Window menu.
5. Select (click on) the first thumbnail and press the "plus" in the Behaviors panel (on the Tag Inspector panel). Choose "swap image."
6. In the field at the top of the swap image window, all named images will be listed. Click on the image that is your "resting" image. You will tell DW to swap that image with the one you will browse to. Make sure you ask the system to Preload images and Restore images on mouseout. That's all there is to it!
   
7. Be warned: if you move the page around within the site files, your image source paths will not be updated automatically, and you will probably have to remove and re-apply the behaviors. I speak from experience!