ASTRONAUT BACKGROUND EFFECT SCRIPT

Bookmark and Share
Step by Step how to install java script effect for Astronout, you can follow instruction as below to implement in your website or blog :

<!-- TWO STEPS TO INSTALL ASTRONAUT:

  1.  Add the onLoad event handler into the BODY tag
  2.  Copy the coding into the BODY of your HTML document  -->

<!-- STEP ONE: Insert the onLoad event handler into your BODY tag  -->

<BODY bgcolor="black" onLoad="space()">

<!-- STEP TWO: Paste this code into the BODY of your HTML document  -->

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin
astropic = "astronaut.jpg"; // location of YOUR astronaut image
var xval = new Array(); // holds star coordinates
var yval = new Array();
no = 100;  // number of stars in the background
speed = 200; // speed
xp = 20 + 100 * Math.random();
yp = 20 + 100 * Math.random();
angle = 3.14 * Math.random(); // astronaut angle
xinc = 3 * Math.sin(angle);
yinc = 3;
ie = (document.all)? 1 : 0;
ns = (document.layers)? 1: 0;
if (ie) {
width = document.body.clientWidth;
height = document.body.clientHeight;
for (var i = 0; i <= no; i++) {
document.write("<div id=\"div" + i+ "\" style=\"color:white;");
document.write("position:absolute;left:100;\">.</div>");
}
document.write("<div id=\"diva\" style=\"position:absolute;\">");
document.write("<img src=" + astropic + " border=\"0\" width=\"65\" height=\"95\"></div>");
for (i = 0; i <= no; i++) {
xval[i] = width * Math.random();
yval[i] = height * Math.random();
document.all["div" + i].style.left = xval[i];
document.all["div" + i].style.top = yval[i];
   }
}
if (ns) {
width = self.innerWidth;
height = self.innerHeight;
for (var i = 0; i <= no; i++) {
document.write("<layer id=\"div" + i+ "\" style=\"color:white;");
document.write("position:absolute;left:100;\">.</layer>");
}
document.write("<layer id=\"diva\" style=\"position:absolute;\">");
document.write("<img src=" + astropic + " border=\"0\" width=\"65\" height=\"95\"></layer>");
for (i = 0; i <= no; i++) {
xval[i] = width * Math.random();
yval[i] = height * Math.random();
document.layers["div" + i].left = xval[i];
document.layers["div" + i].top = yval[i];
   }
}
function star() {
for (i = 0; i <= no; i = i+4) {
xval[i] +=5;
if ((i%20) == 0) xval[i] += 10;
if(xval[i] >= width)  xval[i] = width * Math.random();
if (ie) document.all["div" + i].style.left = xval[i];
if (ns) document.layers["div" + i].left = xval[i];
}
return true;
}
function goangle() {
angle = 3.14 * Math.random();
xinc = 3 * Math.sin(angle);
return true;
}
function space() {
if (ie) {
document.all["diva"].style.left = xp;
document.all["diva"].style.top = yp;
}
if (ns) {
document.layers["diva"].left = xp;
document.layers["diva"].top = yp;
}
xp += xinc;
yp +=yinc;
star();
if ((xp >= (width - 50)) || (xp <= 10))  { goangle();  xinc = (-1) * xinc; }
if ((yp >= (height - 50)) || (yp <= 10)) {  goangle(); yinc = (-1) * yinc; }
setTimeout('space()', speed);
}
//  End -->
</script>


<!-- Script Size:  3.03 KB -->

{ 0 comments... Views All / Send Comment! }

Post a Comment