« »

This is a cross-browser script that moves any number of images around the page, each following a randomly determined path.

Label: Floating star

Report to us error of this JavaScript

Demo
Enlarge
Reload
New window

Code
Files
JavaScript
HTML
Print

Copy All x2

<SCRIPT language=JavaScript1.2>
<!-- 
/**  by.???&#43384;?&#677;&#45729;vaScript  **/
/**  http://sound.jp/jun88/  **/
var no = 4; // STAR number??
var speed = 20; // smaller number moves the STAR faster

var dx, xp, yp;    // coordinate and position variables
var am, stx, sty;  // amplitude and step variables
var i, doc_width = 800, doc_height = 1800;
function star(){
doc_width =document.body.clientWidth;
doc_height =document.body.clientHeight;
dy = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();
sayu=new Array();
j = 0;

for (i = 1; i < (no+1); ++ i) {
dy[i] = 0;                        // set coordinate variables
xp[i] = Math.random()*(doc_width-50);  // set position variables
yp[i] = Math.random()*(doc_height-50);
am[i] = Math.random()*20;         // set amplitude variables
sty[i] = 0.02 + Math.random()/10; // set step variables
stx[i] = 1.7 + Math.random();     // set step variables
sayu[i]=2.5*Math.random()-1;
document.all["dot"+i].style.display="block";

}
STAR_IE();
}
function STAR_IE() {
for (i = 1; i <( no+1); ++ i) {  // iterate for every dot
xp[i] += stx[i];
yp[i]=yp[i]+sayu[i];
if ((xp[i] > doc_width-50)||(yp[i] > doc_height-50)) {
yp[i] = Math.random()*(doc_height-am[i]-50);
xp[i] = 0;
sty[i] = 0.02 + Math.random()/10;
stx[i] = 1.7 + Math.random();
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}
dy[i] += sty[i];
document.all["dot"+i].style.pixelTop =document.body.scrollTop+ yp[i]+ am[i]*Math.sin(dy[i]);
document.all["dot"+i].style.pixelLeft =document.body.scrollLeft+xp[i];
}
setTimeout("STAR_IE()", speed);
}
// End -->
</SCRIPT>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->

Copy All x2

<body onload=star()>
<DIV id=dot1 
style="DISPLAY: none; LEFT: 15px; POSITION: absolute; TOP: 105px"><IMG height=19 
src="index_f1.gif" width=21 border=0></DIV>
<DIV id=dot2 
style="DISPLAY: none; LEFT: 15px; POSITION: absolute; TOP: 135px"><IMG height=19 
src="index_f2.gif" width=21 border=0></DIV>
<DIV id=dot3 
style="DISPLAY: none; LEFT: 15px; POSITION: absolute; TOP: 165px"><IMG height=19 
src="index_f3.gif" width=21 border=0></DIV>
<DIV id=dot4 
style="DISPLAY: none; LEFT: 15px; WIDTH: 765px; POSITION: absolute; TOP: 195px; HEIGHT: 19px"><IMG 
height=19 src="index_f4.gif" width=21 
border=0></DIV>
</body>
	<!--
    	This script downloaded from www.JavaScriptBank.com
    	Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
	-->