RealPix tags and attribute values create the RealPix timeline and visual effects. If you are familiar with HTML, you will master RealPix mark-up quickly. A typical RealPix tag looks like this:
<fadein start="3" duration="1" target="1"/>
Keep the following points in mind when writing a RealPix file:
<fadein.../>
Only the <imfl> tag, which uses the end tag </imfl>, does not close with a slash.
<!-- This is a comment -->
![]() |
Additional Information |
When you are familiar with the tags, you can use "RealPix Tag Summary" as a quick reference. To learn more about Extensible Mark-up Language (XML), the language that RealPix is based on, visit http://www.w3.org/XML. |
All information in the file occurs between an opening <imfl> tag and a closing </imfl> tag. This is the only tag that uses an end tag.
The <head> tag follows the <imfl> tag in the RealPix file. Unlike the HTML <head> tag, the RealPix <head> tag does not have a corresponding </head> tag. Instead, it ends with a slash:
<head...attributes.../>
The <head> tag defines standard header information such as title, author, and copyright. It also sets necessary parameters such as the presentation duration and streaming bit rate.
These required attributes set the width of the display window in pixels. RealPlayer's playback area expands to this size when the RealPix presentation begins. This example creates a RealPix playback area 256 by 256 pixels:
<head width="256" height="256".../>
When you play RealPix with another display media type such as video, you lay out playback regions with SMIL. You typically create for RealPix a playback region that uses the same width and height you set here. If the region is a different size, the SMIL settings determine how to handle the size difference, such as by scaling or cropping the RealPix presentation to fit the display region.
![]() |
Additional Information |
For information on SMIL mark-up, see RealMedia Production Guide available at http://www.real.com. |
This optional attribute lets you set the format for start and duration times. By default, RealPix time values are in the following format:
dd:hh:mm:ss.xyz
Here, dd is days, hh is hours, mm is minutes, ss is seconds, x is tenths of seconds, y is hundredths of seconds, and z is milliseconds. Only the ss field is required. When the time value does not include a decimal point, the last field is read as the seconds.
For example, 1:30
means 1 minute and 30 seconds, whereas 1:30:00
means 1 hour and 30 minutes. Note that all the following values are equivalent. Each starts the effect 90 minutes after the RealPix presentation begins:
start="1:30:00.0"
start="90:00"
start="5400"
You can change all RealPix time values to milliseconds by adding the following to the <head> tag:
<head timeformat="milliseconds".../>
In this case, the time value 5400
is read as 5400 milliseconds (5.4 seconds). Millisecond time values cannot include colons or a decimal point.
Duration is a required value that sets the length of the entire RealPix presentation. For example, the following value sets a duration of 50 seconds:
<head duration="50".../>
All RealPix effects stop immediately when the duration elapses. When the duration time exceeds the time required to complete the effects, the last effect stays frozen in the display window.
![]() |
Tip |
Set a high duration when you start building a RealPix presentation. Set the final duration time when you have finished defining the effects. |
![]() |
Additional Information |
SMIL mark-up also includes a duration setting that can stop the RealPix presentation even if its internal duration time has not elapsed. See RealMedia Production Guide available at http://www.real.com. |
The required bitrate attribute specifies the maximum bandwidth the presentation consumes. Specify the value in bits per second (bps). For example, the following value sets a maximum bandwidth of 12000 bps (approximately 12 Kbps):
<head bitrate="12000".../>
![]() |
Additional Information |
For information on dividing bandwidth between various media types in a presentation, see RealMedia Production Guide available at http://www.real.com. "RealPix Bandwidth Usage" explains how to calculate bandwidth requirements for a RealPix presentation. |
Preroll is an optional value that specifies the time to buffer data in RealPlayer before the start of the RealPix presentation. For example, the following sets the RealPix preroll to 40 seconds:
<head preroll="40".../>
RealSystem always calculates the preroll required for the presentation based on the image file sizes and RealPix mark-up. If this calculated value is larger than the preroll you set, it overrides your specified preroll. Your preroll value is used, however, if it is higher than the calculated preroll value. You therefore need to set the preroll value only if you want an artificially high preroll.
A high preroll can be useful when you stream RealPix with another media type. Suppose that a RealVideo clip starts midway through a RealPix presentation. You can use a high preroll to download a significant portion of the RealPix data before the presentation starts. The RealVideo clip then has more bandwidth available when it begins. It can therefore stream its required preroll without competing with RealPix for bandwidth.
![]() |
Tip |
Always balance preroll values with viewer expectations. Viewers may not stay tuned to a presentation that takes a long time to start playing back. |
![]() |
Additional Information |
For more on preroll, see "RealPix Bandwidth Usage". |
The start time is an optional attribute that delays RealPix playback. If you leave the start time out, the RealPix timeline starts as soon as the initial buffering has completed. If the RealPix file plays in parallel with another file type (through the SMIL <par> tag), both files start their internal timelines at the same point.
You can delay the RealPix timeline by three seconds, for example, by setting a start time of 3:
<head start="3".../>
When the RealPix file is played in parallel with another file, for example, the RealPix file's internal timeline will lag the other file's timeline by three seconds. This start time offsets all effects defined in the RealPix file. For example, an effect set to begin one second into the timeline (with a start="1"
attribute), starts four seconds after the file starts playback.
You can also use SMIL begin times to delay RealPix playback. In this case any delay you specify through the SMIL file is added to the delay set with the RealPix start attribute.
![]() |
Additional Information |
For information on SMIL mark-up, see RealMedia Production Guide available at http://www.real.com. |
These optional tags define the title, author, and copyright information for the presentation:
<head title="The Garden"
author="Jane Doe"
copyright="© 1998 RealNetworks, Inc.".../>
When present, these tags define the values that display in the RealPlayer information window.
This optional attribute sets a hyperlink URL for the presentation. When the user clicks a presentation image, the URL opens in the user's default Web browser. Individual effects can override this value with their own URL setting. For the attribute value, use a fully qualified URL such as the following:
<head url="http://www.real.com".../>
With its default value of "true," the aspect attribute keeps a source rectangle's height-to-width ratio constant when the destination rectangle has a different ratio. You can turn this off by setting the attribute to false:
<head aspect="false".../>
In this case, the height-to-width ratio in the source rectangle changes as necessary to fill the destination rectangle fully. This may distort the source image.
![]() |
Note |
The aspect attribute in the <head> tag affects the entire presentation. Individual effects can override this setting with their own aspect attributes, however. |
![]() |
Additional Information |
See "Controlling Image Aspect". |
This optional attribute sets the maximum frames per second (fps) for transition effects. It is not required because RealPlayer determines the optimal frame rate based on the playback computer's available CPU power. When CPU power is plentiful, RealPlayer renders transition effects at the maximum of 30 fps. It scales down the transition rates accordingly when less CPU power is available.
You can set maxfps low to create special effects. For example, a value of 5:
<head...maxfps="5"/>
keeps transitions constrained to no more than 5 fps. This causes visible jerks in transitions, which may be a desirable effect.
![]() |
Note |
Specify maxfps as the last attribute in the <head> tag. The maxfps value affects the entire presentation, but individual effects can override it with their own maxfps values. |
For each image you use in the RealPix presentation, you add an <image> tag after the <head> tag. The <image> tag provides the image file location and assigns a unique handle number to the image. An <image> tag looks like this:
<image handle="2" name="eagle.jpg"/>
The required handle attribute assigns a positive integer to the image. Each handle number within the file must be unique. The RealPix effects then refer to the handle number rather than the file name. Here is an example:
<image handle="23".../>
The name attribute is required. It specifies the image file name and a path relative to the location of the RealPix file. The following example designates an image file that resides in the same directory as the RealPix file:
<image name="tulip.jpg".../>
This next example indicates that the image file resides one level below the RealPix file in the "images" directory:
<image name="images/tulip.jpg".../>
![]() |
Tip |
The file name and path are case-sensitive. If you are streaming files from RealServer, folder (directory) names should not contain spaces. |
![]() |
Additional Information |
The relative syntax for paths works like relative hyperlink syntax in HTML. You can find additional information about this topic in an HTML reference. |
The <fill> tag displays a colored rectangle in the display window. This is useful at the beginning of a presentation or anytime you want to paint over all or part of the display window. You can fade in an image, for instance, then fill the display window with black to paint over the image. A <fill> tag looks like this:
<fill start="0" color="blue"/>
The start time is required. It specifies the time from the beginning of the RealPix timeline that the fill occurs. The following example starts the fill 2.3 seconds into the presentation timeline:
<fill start="2.3".../>
![]() |
Additional Information |
For information on the RealPix time format, see the <head> tag timeformat attribute. |
This required attribute sets the fill color. You can use a predefined color name or a hexadecimal value as illustrated here:
<fill color="#FF0000".../>
![]() |
Additional Information |
For more on color values and names, see "Colors". |
These optional attributes define the size and placement of the filled region. Leave them out to fill the entire display window. To fill only a portion of the display window, set the destination rectangle's x and y coordinates, as well as its height and width in pixels:
dstx | X coordinate of the destination rectangle. |
dsty | Y coordinate of the destination rectangle. |
dstw | Width of the destination rectangle. |
dsth | Height of the destination rectangle. |
Here's an example that fills a rectangle 128 by 128 pixels. The filled region appears 92 pixels to the right of the main window's left edge and 64 pixels down from its top edge
<fill...dstx="92" dsty="64" dstw="128" dsth="128"/>
![]() |
Additional Information |
For more on the sizes and offsets of source and destination rectangles, see "Controlling Image Size, Placement, and Aspect". |
The <fadein> tag creates a gradual transition from the currently displayed color or image to another image. A <fadein> tag looks like this:
<fadein start="4" duration="3" target="2"/>
The following figure illustrates a fade-in from a solid color to an image. If you have RealPlayer installed, click here to see fade-in examples. Click here to see the RealPix source file that creates these effects.
The start time is required. It specifies the time from the beginning of the RealPix timeline that the fade-in occurs. Here is an example that starts the fade-in 4 seconds into the timeline:
<fadein start="4".../>
![]() |
Additional Information |
For information on the RealPix time format, see the <head> tag timeformat attribute. |
This required attribute specifies the total time for the effect to complete. The higher the value, the slower the fade-in. For example, the following value means the fade-in takes 2.5 seconds to complete:
<fadein duration="2.5".../>
The target value is required. It specifies the <image> tag handle of the image to fade in. For example:
<fadein target="2".../>
These optional attributes define the size and placement of the image that fades in. Leave them out to fade the image into the entire display window. To fade the image into a portion of the display window, set the destination rectangle's x and y coordinates, as well as its height and width in pixels:
dstx | X coordinate of the destination rectangle. |
dsty | Y coordinate of the destination rectangle. |
dstw | Width of the destination rectangle. |
dsth | Height of the destination rectangle. |
The following example fades the image into a rectangle 128 by 128 pixels. The image displays 20 pixels to the right of the main window's left edge and 40 pixels down from its top edge:
<fadein dstx="20" dsty="40" dstw="128" dsth="128".../>
![]() |
Additional Information |
For more on the sizes and offsets of source and destination rectangles, see "Controlling Image Size, Placement, and Aspect". |
These four attributes define what portion of the source image fades into the destination rectangle. Leave them out to fade the entire source image into the destination rectangle. To use only a portion of the source image, set the source rectangle's x and y coordinates, as well as its height and width in pixels.
srcx | X coordinate of the source rectangle. |
srcy | Y coordinate of the source rectangle. |
srcw | Width of the source rectangle. |
srch | Height of the source rectangle. |
The following example selects from the source image a source rectangle 128 pixels wide by 256 pixels high. The source rectangle starts 64 pixels to the right of the source image's left edge and 92 pixels down from its top edge:
<fadein dstx="64" dsty="92" dstw="128" dsth="256".../>
![]() |
Additional Information |
For more on the sizes and offsets of source and destination rectangles, see "Controlling Image Size, Placement, and Aspect". |
This optional attribute sets a hyperlink URL for the effect. When the user clicks the image, the user's default Web browser opens the URL. This URL value overrides the presentation default set in the <head> tag. Use a fully qualified URL like the following:
<fadein url="http://www.real.com".../>
This optional attribute determines whether the source rectangle's height-to-width ratio is maintained when the destination rectangle has a different height-to-width ratio. The presentation's default value is set in the <head> tag, but you can override it for the fade-in:
<fadein aspect="false".../>
This optional attribute sets the maximum frames per second for the effect. It overrides any default maxfps value set in the <head> tag. Include it as the last attribute. Here's an example:
<fadein...maxfps="5"/>
![]() |
Additional Information |
See the <head> tag's "maxfps" attribute for information on setting a presentation default value for maxfps. |
The <fadeout> tag defines a transition from an image to a color. The basic <fadeout> tag looks like this:
<fadeout start="10" duration="3" color="yellow"/>
The following figure illustrates a fade-out. If you have RealPlayer installed, click here to see fade-out examples. Click here to see the RealPix source file that creates these effects.
The start time is required. It specifies the time from the beginning of the RealPix timeline that the fade-out occurs. The following example starts the fade-out 10 seconds into the presentation:
<fadeout start="10".../>
![]() |
Additional Information |
For information on the RealPix time format, see the <head> tag timeformat attribute. |
This required attribute specifies the total time the effect takes to complete. The higher the value, the slower the fade-out. For example, the following makes the fade-out last 3.75 seconds:
<fadeout duration="3.75".../>
This required attribute sets the color the image fades to. You can use a hexadecimal value or a predefined color name as illustrated here:
<fadeout color="blue".../>
![]() |
Additional Information |
For more on color values and names, see "Colors". |
These optional attributes define the size and placement of the rectangle that fades out. Leave them out of the tag to fade out the entire display window. To fade out only a portion of the display window, set the destination rectangle's x and y coordinates, as well as its height and width in pixels:
dstx | X coordinate of the destination rectangle. |
dsty | Y coordinate of the destination rectangle. |
dstw | Width of the destination rectangle. |
dsth | Height of the destination rectangle. |
The following example fades out a rectangle 64 pixels wide by 64 pixels high. The rectangle starts 110 pixels to the right of the main window's left edge and 80 pixels down from its top edge:
<fadeout dstx="110" dsty="80" dstw="64" dsth="64".../>
![]() |
Additional Information |
For more on the sizes and offsets of source and destination rectangles, see "Controlling Image Size, Placement, and Aspect". |
This optional attribute sets the maximum frames per second for the effect. It overrides any default maxfps value set in the <head> tag. Include it as the last attribute. Here's an example:
<fadeout...maxfps="5"/>
![]() |
Additional Information |
See the <head> tag's "maxfps" attribute for information on setting a presentation default value for maxfps. |
The <crossfade> tag creates a transition from one image to another, as illustrated in the following figure.
The start time is required. It specifies the time from the beginning of the RealPix timeline that the crossfade occurs. Here is an example that starts the effect 12.3 seconds into the timeline:
<crossfade start="12.3".../>
![]() |
Additional Information |
For information on the RealPix time format, see the <head> tag timeformat attribute. |
This required attribute specifies the total time the effect takes to complete. The higher the value, the slower the crossfade. For example, the following makes the crossfade take just 1.5 seconds to complete:
<crossfade duration="1.5".../>
The target value is required. It specifies the <image> tag handle of the image to fade in. For example:
<crossfade target="2".../>
These optional attributes define the size and placement of the image that fades in. Leave them out to fade the image into the entire display window. To fade the image into a portion of the display window, set the destination rectangle's x and y coordinates, as well as its height and width in pixels:
dstx | X coordinate of the destination rectangle. |
dsty | Y coordinate of the destination rectangle. |
dstw | Width of the destination rectangle. |
dsth | Height of the destination rectangle. |
The following example fades the image into a rectangle 128 by 128 pixels. The image displays 20 pixels to the right of the main window's left edge and 40 pixels down from its top edge:
<crossfade dstx="20" dsty="40" dstw="128" dsth="128".../>
![]() |
Additional Information |
For more on the sizes and offsets of source and destination rectangles, see "Controlling Image Size, Placement, and Aspect". |
These four attributes define what portion of the source image fades into the destination rectangle. Leave them out to fade the entire source image into the destination rectangle. To use only a portion of the source image, set the source rectangle's x and y coordinates, as well as its height and width in pixels.
srcx | X coordinate of the source rectangle. |
srcy | Y coordinate of the source rectangle. |
srcw | Width of the source rectangle. |
srch | Height of the source rectangle. |
The following example selects from the source image a source rectangle 128 pixels wide by 256 pixels high. The source rectangle starts 64 pixels to the right of the source image's left edge and 92 pixels down from its top edge:
<crossfade dstx="64" dsty="92" dstw="128" dsth="256".../>
![]() |
Additional Information |
For more on the sizes and offsets of source and destination rectangles, see "Controlling Image Size, Placement, and Aspect". |
This optional attribute sets a hyperlink URL for the effect. When the user clicks the image, the user's default Web browser opens the URL. This URL value overrides the presentation default set in the <head> tag. Use a fully qualified URL like the following:
<crossfade url="http://www.real.com".../>
This optional attribute determines whether the source rectangle's height-to-width ratio is maintained when the destination rectangle has a different height-to-width ratio. The presentation's default value is set in the <head> tag, but you can override it for the crossfade:
<crossfade aspect="false".../>
This optional attribute sets the maximum frames per second for the effect. It overrides any default maxfps value set in the <head> tag. Include it as the last attribute. Here's an example:
<crossfade...maxfps="5"/>
![]() |
Additional Information |
See the <head> tag's "maxfps" attribute for information on setting a presentation default value for maxfps. |
The <wipe> tag creates a transition from an image to another image, either by covering the displayed image or by pushing it out of the way with a sliding effect. A typical <wipe> tag looks like this:
<wipe type="push" direction="left" start="10" duration="3" target="2"/>
The following figure illustrates this effect. If you have RealPlayer installed, click here to see wipe examples. Click here to see the RealPix source file that creates these effects.
The start time is required. It specifies the time from the beginning of the RealPix timeline that the wipe occurs. Here is an example that starts the effect 30 seconds into the presentation:
<wipe start="30".../>
![]() |
Additional Information |
For information on the RealPix time format, see the <head> tag timeformat attribute. |
This required attribute specifies the total time the effect takes to complete. The higher the value, the slower the transition. For example, the following makes the wipe take 5.5 seconds to complete:
<wipe duration="5.5".../>
The target value is required. It specifies the <image> tag handle of the image to bring in with the wipe effect. For example:
<wipe target="2".../>
This required attribute defines the type of transition that occurs:
normal | New image moves over current image, which remains stationary. |
push | New image pushes current image out (both images move). |
<wipe type="push".../>
This required attribute sets the direction the new image moves:
<wipe direction="up".../>
These optional attributes define the size and placement of the image that moves in. Leave them out to move the image into the entire display window. To move the image into a portion of the display window, set the destination rectangle's x and y coordinates, as well as its height and width in pixels:
dstx | X coordinate of the destination rectangle. |
dsty | Y coordinate of the destination rectangle. |
dstw | Width of the destination rectangle. |
dsth | Height of the destination rectangle. |
The following example moves the image into a rectangle 64 by 64 pixels. The image displays 50 pixels to the right of the main window's left edge and 70 pixels down from its top edge:
<wipe dstx="50" dsty="70" dstw="64" dsth="64".../>
![]() |
Additional Information |
For more on the sizes and offsets of source and destination rectangles, see "Controlling Image Size, Placement, and Aspect". |
These four attributes define what portion of the source image moves into the display rectangle. Leave them out to move the entire source image into the destination rectangle. To use a portion of the source image, set the source rectangle's x and y coordinates, as well as its height and width in pixels.
srcx | X coordinate of the source rectangle. |
srcy | Y coordinate of the source rectangle. |
srcw | Width of the source rectangle. |
srch | Height of the source rectangle. |
The following example selects from the source image a source rectangle 128 pixels wide by 128 pixels high. The source rectangle starts 89 pixels to the right of the source image's left edge and 115 pixels down from its top edge:
<wipe dstx="89" dsty="115" dstw="128" dsth="128".../>
![]() |
Additional Information |
For more on the sizes and offsets of source and destination rectangles, see "Controlling Image Size, Placement, and Aspect". |
This optional attribute sets a hyperlink URL for the new image. When the user clicks the image, the user's default Web browser opens the URL. This URL value overrides the presentation default set in the <head> tag. Use a fully qualified URL like the following:
<wipe url="http://www.real.com".../>
This optional attribute determines whether the source rectangle's height-to-width ratio is maintained when the destination rectangle has a different height-to-width ratio. The presentation's default value is set in the <head> tag, but you can override it for the wipe effect:
<wipe aspect="false".../>
This optional attribute sets the maximum frames per second for the effect. It overrides any default maxfps value set in the <head> tag. Include it as the last attribute. Here's an example:
<wipe...maxfps="5"/>
![]() |
Additional Information |
See the <head> tag's "maxfps" attribute for information on setting a presentation default value for maxfps. |
The <viewchange> tag defines a pan or a zoom. A typical <viewchange> tag looks like this:
<viewchange start="24" duration="3"
srcx="80" srcy="80" srcw="48" srch="48"/>
Note that the viewchange does not specify an image. The view change always affects the image currently in the display window. The following figure illustrates a zoom created with a <viewchange> tag. If you have RealPlayer installed, click here to see pan and zoom examples. Click here to see the RealPix source file that creates these effects.
The start time is required. It specifies the time from the beginning of the RealPix timeline that the view change occurs. The following example starts the effect 35.2 seconds into the presentation timeline:
<viewchange start="35.2".../>
![]() |
Additional Information |
For information on the RealPix time format, see the <head> tag timeformat attribute. |
This required attribute specifies the total time the effect takes to complete. The higher the value, the slower the pan or zoom. For example, the following makes the transition take 8 seconds to complete:
<viewchange duration="8".../>
These four attributes define in pixels the placement and size of the destination rectangle. See below for more information.
dstx | X coordinate of the destination rectangle. |
dsty | Y coordinate of the destination rectangle. |
dstw | Width of the destination rectangle. |
dsth | Height of the destination rectangle. |
These four attributes define in pixels the placement and size of the source image. See below for more information.
srcx | X coordinate of the source rectangle. |
srcy | Y coordinate of the source rectangle. |
srcw | Width of the source rectangle. |
srch | Height of the source rectangle. |
This optional attribute sets the maximum frames per second for the effect. It overrides any default maxfps value set in the <head> tag. Include it as the last attribute. Here's an example:
<viewchange...maxfps="5"/>
![]() |
Additional Information |
See the <head> tag's "maxfps" attribute for information on setting a presentation default value for maxfps. |
To zoom in on an image, display the image and then use <viewchange> to define the area to zoom in on. The following example is taken from a RealPix presentation that displays in a window 256 by 256 pixels. The source image is also 256 by 256 pixels. The presentation fades in on the image and then zooms in, taking three seconds to complete the zoom:
<fadein start="1" duration="2" target="1"/>
<viewchange start="4" duration="3"
srcx="64" srcy="64" srcw="128" srch="128"/>
The zoom selects an area 128 by 128 pixel square in the center of the source image. This square displays in the full 256 by 256 pixel display window. The following figure illustrates this zoom.
Because this zoom effect does not specify a destination rectangle, the zoom image fills the entire display window. But you can also use the destination coordinates (dstx, dsty, dstw, dsth) to specify a portion of the display window.
To pan across an image, you display a portion of the source image, then use <viewchange> to move to a different part of the source image. The following example uses a RealPix presentation that displays in a window 256 by 256 pixels. The source image is also 256 by 256 pixels:
<fadein start="1" duration="3" target="2"/>
<viewchange start="4" duration="3"
srcx="0" srcy="0" srcw="128" srch="128"/>
<viewchange start="7" duration="3"
srcx="128" srcy="0" srcw="128" srch="128"/>
The presentation fades in an image, zooms in on the upper left-hand quadrant, then pans to the upper, right-hand quadrant. Each effect takes three seconds to complete. The following figure illustrates this movement.
Because this pan effect does not specify a destination rectangle, the source rectangle fills the entire display window. But you can also use the destination coordinates (dstx, dsty, dstw, dsth) to specify a portion of the display window.
RealPix effects that use colors can specify a 24-bit, hexadecimal color value. These are the same color values as those used in HTML. The first two hex digits represent red, the next two green, and the last two blue. For example, "#FF8000" indicates the 24-bit RGB color 255:128:0. Alternately, RealPix color attributes can use the predefined names shown below.
The following example RealPix file demonstrates the RealPix mark-up. Click here to play this sample file in RealPlayer.
<imfl>
<head title="RealPix(tm) Sample Effects"
author="Jay Slagle"
copyright="(c)1998 RealNetworks, Inc."
timeformat="dd:hh:mm:ss.xyz"
duration="46"
bitrate="12000"
width="256"
height="256"
url="http://www.real.com"
aspect="true"/>
<!-- Assign handle numbers to images --/>
<image handle="1" name="jbeans.jpg"/>
<image handle="2" name="peppers.jpg"/>
<image handle="3" name="elephant.jpg"/>
<image handle="4" name="hippo.jpg"/>
<image handle="5" name="interior.jpg"/>
<!-- Fade in and crossfade images --/>
<fill start="0" color="black"/>
<fadein start="1" duration="2" target="1"/>
<crossfade start="4" duration="3" target="2"/>
<!-- Fade out with expanding squares --/>
<fadeout start="8" duration="1" color="lime"
dstx="96" dsty="96" dstw="64" dsth="64"/>
<fadeout start="9" duration="1" color="green"
dstx="64" dsty="64" dstw="128" dsth="128"/>
<fadeout start="10" duration="1" color="#6D8073"
dstx="32" dsty="32" dstw="192" dsth="192"/>
<fadeout start="11" duration="1" color="black"
dstx="0" dsty="0" dstw="256" dsth="256"/>
<!-- Wipe in checkerboard images --/>
<fadein start="13" duration="3" target="3"/>
<wipe type="push" direction="left" start="16"
duration="3" target="4"
srcx="0" srcy="0" srcw="128" srch="128"
dstx="0" dsty="0" dstw="128" dsth="128"/>
<wipe type="push" direction="right" start="19"
duration="3" target="4"
srcx="128" srcy="128" srcw="128" srch="128"
dstx="128" dsty="128" dstw="128" dsth="128"/>
<wipe type="push" direction="up" start="22"
duration="3" target="4"
srcx="0" srcy="128" srcw="128" srch="128"
dstx="0" dsty="128" dstw="128" dsth="128"/>
<wipe type="push" direction="down" start="25"
duration="3" target="4"
srcx="128" srcy="0" srcw="128" srch="128"
dstx="128" dsty="0" dstw="128" dsth="128"/>
<!-- Zoom in and pan --/>
<fadein start="29" duration="3" target="5"/>
<viewchange start="32" duration="3"
srcx="0" srcy="0" srcw="160" srch="160"/>
<viewchange start="35.5" duration="3"
srcx="96" srcy="0" srcw="160" srch="160"/>
<viewchange start="39" duration="3"
srcx="96" srcy="96" srcw="160" srch="160"/>
<viewchange start="42.5" duration="3"
srcx="0" srcy="96" srcw="160" srch="160"/>
</imfl>