Filters And Transitions In IE5 - Into The Blender (
Page 7 of 9 )
In
addition to all these filters, Internet Explorer also comes with in-built
capabilities for transition effects as you move from page to page within a site.
These transitions are nothing but very powerful filters, which allow you to
morph one image into another, or display pre-defined effects when specific
events occur.
Currently, Internet Explorer supports a bunch of different
transitions. The first of these is the blend transition, which is demonstrated
in the following example:
<html>
<head>
<script language="JavaScript">
// function to perform transition
function playTransition()
{
// apply transition
document.all.object.filters.blendTrans.Apply();
// change image source
document.all.object.src = "face.gif";
// play transition
document.all.object.filters.blendTrans.Play();
}
</script>
</head>
<body onLoad="playTransition()">
<img id=object style="filter:blendTrans(duration=3)" src="square.gif"
border="0">
</body>
</html>
In this case, the square block will slowly morph into a face, the
entire transition taking place over three seconds. You can alter the duration
with the "duration" attribute of the "blendTrans" filter.
This article copyright Melonfire 2000. All rights
reserved.