Functions

turn_on() - turn_off()

DEFINITION


turn_on(img_name);
turn_off(img_name);

img_name - the name of an image/AnimatedImage() in an HTML document

REQUIREMENTS

AnimatedGif() or AnimatedJpg() or AnimatedImage()

<IMG SRC="images/ani_name/0.gif" NAME="img_name">

DESCRIPTION

These functions are intended to be called when onMouseOver and onMouseOut events occur within a Hyperlink although they can be called using any other event handler (onLoad, onClick). The function turn_on() will start the animation running forward up to the last frame in the animation. Once turn_on() is called the animation will ALWAYS run until the last frame is reached even if turn_off() is called before that happens. The function turn_off() will start an animation running backwards from the last frame until the first frame (frame 0) is reached. If the animation is not at the last frame when turn_off() is called then the animation is marked for "close_required" and when it reaches the last frame the animation will start running back through the frames. The following example shows a vertical navbar of three animated images that animate when the mouse moves over the image.

EXAMPLE

<HEAD>
    AnimatedJpg("home", 5);
    AnimatedJpg("email", 5);
    AnimatedJpg("links", 5);
</HEAD>

<BODY>
    <A HREF="some_url"
        onMouseOver="turn_on('home')"
        onMouseOut="turn_off('home')><IMG SRC="images/home/0.jpg" NAME="home"></A><br>
    <A HREF="some_url"
        onMouseOver="turn_on('email')"
        onMouseOut="turn_off('email')><IMG SRC="images/email/0.jpg" NAME="email"></A><br>
    <A HREF="some_url"
        onMouseOver="turn_on('links')"
        onMouseOut="turn_off('linksl')><IMG SRC="images/links/0.jpg" NAME="links"></A><br>
</BODY>

The following example defines multiple animated images using just 1 animation.

EXAMPLE

<HEAD>
<SCRIPT>
    AnimationFrames("door_ani", 10, ".jpg");
    AnimatedImage("door1","door_ani");
    AnimatedImage("door2","door_ani"):
    AnimatedImage("door3","door_ani"):
</SCRIPT>
</HEAD>

<BODY>
    <A HREF="some_url"
        onMouseOver="turn_on('door1')"
        onMouseOut="turn_off('door1')><IMG SRC="images/door_ani/0.jpg" NAME="door1"></A><br>
    <A HREF="some_url"
        onMouseOver="turn_on('door2')"
        onMouseOut="turn_off('door2')><IMG SRC="images/door_ani/0.jpg" NAME="door2"></A><br>
    <A HREF="some_url"
        onMouseOver="turn_on('door3')"
        onMouseOut="turn_off('door3')><IMG SRC="images/door_ani/0.jpg" NAME="door3"></A><br>
</BODY>

 

<<Index>>