Uncle Jims Web Designs: Moving Images on Page

Uncle Jim's Web Designs

Moving Images

Author: Jim Stiles
This is an example of how to place moving objects on your page. An added feature is the
ability to set the object's display properties different than that of the actual HTML page.
This is done using the Z-index attribute. You can change the image location to anywhere on the page.

As you can see, the image slides in underneath the existing text and images on the page.
This is an excellent way to get your visitors' attention.

INSTALLATION INSTRUCTIONS

COPY - Insert Between Head Tags: <HEAD></HEAD>

<script type="text/javascript"><!-- 
/*
 _____________________________________
/ЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇ\
| Another JavaScript from Uncle Jim   |
| Feel free to copy, use and change   |
| this script as long as this part    |
| remains unchanged. You can visit    |
| my website at http://jdstiles.com   |
| for more scripts like this one.     |
| Created: 1998 Updated: 2006         |
\_____________________________________/
 ЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇЇ
*/
ie4 = ((navigator.appName == "Microsoft Internet Explorer") && (parseInt(navigator.appVersion) >= 4 ))
ns4 = ((navigator.appName == "Netscape") && (parseInt(navigator.appVersion) >= 4 ))

if (ns4) {
    layerRef="document.layers";
    styleRef="";

} else {
    layerRef="document.all";
    styleRef=".style";

}

function moveDivision(which, start, finish, step, speed){  
  if (ie4 || ns4){
    if (start < finish){ 
      eval(layerRef + '["' + which +'"]' + styleRef + '.top = start');
      eval(layerRef + '["' + which +'"]' + styleRef + '.left = start');
      start=start+step; 
      setTimeout("moveDivision('"+which+"',"+start+","+finish+","+step+","+speed+")",speed);
    }     
  }
}
//--></script>

COPY - Insert Inside Body: <BODY></BODY>

COPY - Insert into Body Tag: <BODY 'CODE HERE'>

Close This Window