Dynamic Drive DHTML Scripts- Flying Image script

IE5+

Flying Image script

Description: While most DHTML scripts are written using the JavaScript language, it certainly doesn't have to be. DHTML is a generic enhancement of fourth+ generation browsers that can be manipulated using a variety of scripting languages. In this demonstration, VBscript (in combination with JavaScript) is used to create a DHTML script that flys a relatively-positioned image straightly across the screen. VBscript is only supported by IE, and is the preferred language for accessing and communicating with ActiveX controls. To learn more about programming in VBscript, click here.

Demo:

Directions:

Step 1: Add the following into the <body> section of your page. Change the image path at the end of the code to refer to your own image:

Select All
<script language="VBScript"> on error resume next if parent.navButtonStatus <> 3 then if err.number <> 0 then call parent.ThereIsAnError end if end if </script> <script language="JavaScript"> /* Flying Image Script- By Dylan Coldblatt (codeboy14@yahoo.com) Submitted to Dynamicdrive.com for featuring in it's archive For full source code, installation instructions, 100's more DHTML scripts, and Terms Of Use, visit dynamicdrive.com */ var yend; var ystart; var ydiff; var xincrement; var yincrement; var screenwidth; var screenheight; function Ypick(){ if (!document.all) return screenwidth = screensize.offsetWidth; screenheight = screensize.offsetHeight; xincrement = (screenwidth/10); ystart = Math.round(Math.random()*(screenheight-92)); yend = Math.round(Math.random()*(screenheight-92)); document.all.ball.style.top=ystart; document.all.ball.style.left=-100; if (ystart > yend){ ydiff = (ystart-yend); yincrement = (ydiff/xincrement); Moveneg(); } else { ydiff = (yend-ystart); yincrement = (ydiff/xincrement); Movepos(); } } function Moveneg(){ if (screenwidth > parseInt(document.all.ball.style.left)) { with (document.all.ball) { style.left = parseInt(style.pixelLeft + 10); style.top = parseInt(style.pixelTop - yincrement); } setTimeout('Moveneg()',20); } else { with (document.all.ball) { style.left = parseInt(style.pixelLeft - screenwidth); style.top = parseInt(style.pixelTop - yend); } Ypick(); } } function Movepos(){ if (screenwidth > parseInt(document.all.ball.style.left)) { with (document.all.ball) { style.left = parseInt(style.pixelLeft + 10); style.top = parseInt(style.pixelTop + yincrement); } setTimeout('Movepos()',20); } else { with (document.all.ball) { style.left = parseInt(style.pixelLeft - screenwidth); style.top = parseInt(style.pixelTop - yend); } Ypick(); } } </script> <div id="screensize" style="position: absolute; top: 0; left: 0; height: 100%; width: 100%"></div> <p><img id="ball" SRC="http://dynamicdrive.com/plane.gif" style="container:in-flow;position:relative;left:-100;top:0;visibility:show">

Step 2: Finally, add the following event handler to your <body> tag, like below:

<body onload="Ypick()">

Wordpress Users: Step by Step instructions to add ANY Dynamic Drive script to an entire Wordpress theme or individual Post