SiteExperts.com Logo Home | Community | Developer's Paradise | Jobs
User Groups | Site Tools | Site Information | Search

Inside Technique : Image Transition Behavior : Transition.htc Script

Below is the complete script for our transitions behavior. You can also download the transition behavior.

<PUBLIC:COMPONENT NAME="ID_ImageTransition">
<PUBLIC:ATTACH event="onload" handler="Init" />
<PUBLIC:ATTACH event="onpropertychange" handler="TransitionNow" />
<PUBLIC:ATTACH event="onfilterchange" handler="TransitionReset" />l
<SCRIPT>
// Copyright 1999 InsideDHTML.com, LLC. All rights reserved.
// This scriptlet can be reused as long as the above copyright
// notice is maintained.

function TransitionReset() {
  // After running transition,
  // get ready for the next one.
  element.filters[0].Apply();
}

function TransitionNow() {
  // Run the transition if the src is changed
  if (event.propertyName=="src")
    element.filters[0].Play()
  // When filter is set, get ready to run transition
  if (event.propertyName=="style.filter")
    element.filters[0].Apply();
}

function Init() {
  if (element.style.filter=="") // Set the default
    element.style.filter = "revealTrans(Duration=2, Transition=12)"
  else // Force a property change event
    element.style.filter = element.style.filter
}
</SCRIPT>
</PUBLIC:COMPONENT>
Discuss and Rate this Article

Page 1:Image Transition Behavior
Page 2:Adding the behavior
Page 3:Transition.htc Script