Inside Technique : Steve's Behaviors : switch Behavior

The switch behavior makes it easy to rotate text, images, and anchors. In Internet Explorer 5.0, the image and description rotate. Notice how the image blends into the next image. In all other browser, only the first image and description is displayed.

Now showing: Cool Site of Nite

This is the SWITCH.htc behavior. The rotate property describes the content to rotate as a comma delimited list (no space) of the values to switch through. If applied to an image, this property modifies the SRC attribute, if applied to a link, the HREF attribute is modified, and if applied to text, it modifies the innerHTML. The switchDelay properties specifies how many milliseconds to wait between each shift, and offStart specifies how long to wait until after the page is loaded to start rotating the contents. Two methods are exposed, switcho() to start the rotating and stopSwitch to stop it. The event onSwitchChange fires each time the contents change. This event exposes the properties curIndex which is the number of the value that was switched to and curValue which is the value that was switched to, on the event object.

The rotating content is defined as follows:

<img id=sw1 
     style="behavior: url(switch.htc);" 
     offStart 
     switchDelay=5000 
     rotate="/trophy/csotn.gif,/trophy/ie4globeaward.gif,/gifs/toptenlinks.gif" 
     src=/trophy/csotn.gif>
<>Now showing:<BR>
<span id=sw2 
      style="behavior: 
      url(switch.htc);" 
      offStart 
      switchDelay=5000 
      rotate="Cool Site of the Nite,IE4 Globe Award,Top Ten Links">
Cool Site of Nite
</span>

Copyright © 1997-98 InsideDHTML.com, LLC.
All rights reserved.

© 1997-2000 InsideDHTML.com, LLC. All rights reserved.