This example showcases the new
layers feature in the Navigator 4.0 component of Netscape Communicator Preview
Release.
The functionality of the new LAYER tag allows you to define precisely positioned,
overlapping layers of transparent or opaque content in a Web page. With a little
JavaScript code, you can move layers, hide them, and change the order in which
they overlap. With layers you can use HTML and JavaScript to create dynamic
animations on a Web page.
CLICK ME: Set the animation in motion by clicking.
Using the Layer object's left and right properties, the offset() method, or the moveTo() method, layers can be dynamically moved after a page has been drawn. Visible layers can be made to jump across the page, and hidden layers can be moved into position before they are displayed. Other Functions utilized in this demo: moveBy() and setTimeout().
HIT ME: Open Me Mouth!
If a layer is moved from its original position to its final position in increments, it seems to slide on the page. You can control the sliding speed by adjusting how far the layer moves in each increment and how much time passes between increments.
Use the setTimeout() method within a recursive function to separate each
modification to the layer's properties.
For further information on NetScapes Latest innovation and development visit the
NetScape Communicator Preview site. Check out this animated spash screen for my MouseOver Demo.
Here are some more of my Version 4 demonstrations you may enjoy.
|
