Fading Between Images ..............................................................................
Another really useful, attractive effect is to fade or wipe or otherwise transition
between two images. You’ve doubtless seen this technique. It’s used in all
browsers because it can be applied via JavaScript. Some of the best-designed
Web sites use delicate fades — often triggered when you first view the page
as a kind of introduction, with one image gently dissolving into another.
If you want to see some good examples of JavaScript code for “rollovers,”
fades, and other transitions, visit this site:
http://brothercake.com/site/resources/scripts/transitions/
To try this next example (IE-only), ensure that you have two .jpg files in the
same folder on your hard drive where you save the .htm file. These files must
be named first.jpg and second.jpg. You must also include a graphics file named
texture.jpg that can fill the background with some kind of light texture.
<html>
<head>
<SCRIPT LANGUAGE=VBScript>
function fadethem()
myimage.filters.item(0).Apply()
myimage.src=”second.jpg”
myimage.filters.item(0).Play()
end function
</SCRIPT>
<style>
H1 {font-size: 42px;padding-left: 3%;}
BODY {background-image: url(texture.jpg);}
</style>
</HEAD>
<BODY>
<br>
<H1> Join us! We Have all Styles of Houses</h1>
<IMG ID=myimage width=60% height=70%
Chapter 13: Creating Dramatic Visual Effects 243
