Your Workspace

 The Gateway
The Sanctuary
The Grove

What's New
MessageBoards
Live Chat
Houses
Faery Lands
Fae Love
Books
Music


Flying Faery Javascript Code

 

The requests have been overwhelming for the flying fairies, so here it is, so you can add them to your webpage. Please do not ask me for
help installing this code as I am too busy, try asking in the message board as I am sure people there can help you.
All you need to is cut and page your old document into this one at the bottom.

 

<!--------- Starting copying here
<html>
<head>



<script LANGUAGE="JavaScript">
<!--


function preloader() {
if (document.images) {
preloads = new Array(25);
for (m=0; m<=24; m++) {
preloads[m] = new Image(); }

}}

netscape = (document.layers) ? 1:0
goodIE = (document.all) ? 1:0


var delay = 15;
var yAmpl = 3;
var yMax = 8;
var step = .3;
var ystep = .3;
var currStep = 0;
var tAmpl=1;
var j = 0;
var Xpos = 300;
var Ypos = 360;
document.onmousemove=MoveHandler;


if (netscape) {
window.captureEvents(Event.MOUSEMOVE);

// Logo animation
var yBase = window.innerHeight/2;
var xBase = window.innerWidth/2;

function MoveHandler(e) {
if (netscape || goodIE) {
Xpos = (netscape)?e.pageX:event.x
Ypos = (netscape)?e.pageY:event.y
}}

window.onMouseMove = MoveHandler;
}
function startup() {
if (netscape) {
Xpos = 50;
Ypos = 50;
document.a1.visibility='visible';
document.a2.visibility='visible';
document.a3.visibility='visible';
document.a4.visibility='visible';
document.a5.visibility='visible';
document.a6.visibility='visible';
}
else if (goodIE) {
document.all.a1.style.visibility='visible';
document.all.a2.style.visibility='visible';
document.all.a3.style.visibility='visible';
document.all.a4.style.visibility='visible';
document.all.a5.style.visibility='visible';
document.all.a6.style.visibility='visible';
var windowWidth=document.body.clientWidth;
var windowHeight=document.body.clientHeight;
Xpos = (windowWidth/2);
Ypos = (windowHeight/2);}}

function littlejewels() {
if (netscape) {
yBase = window.innerHeight/4 ;
xBase = window.innerWidth/4;
for ( j = 0 ; j < 6 ; j++ ) {
document.layers[j].top=Ypos+Math.cos((20*Math.sin(currStep/(85+j)))+j*70)*yBase*(Math.sin(10+currStep/10)+0.2)*Math.cos((currStep+j*55)/10);
document.layers[j].left=Xpos+Math.sin((20*Math.sin(currStep/85))+j*70)*xBase*(Math.sin(10+currStep/(10+j))+0.2)*Math.cos((currStep+j*55)/10);
}
currStep += step;
setTimeout("littlejewels()", 10) ;
}
else if (goodIE) {
var yBase =document.body.clientWidth/4;
var xBase =document.body.clientHeight/4;
for ( j = 1 ; j <= 6 ; j++ ) {
eval("document.all.a"+j+".style.top=Ypos+Math.cos((20*Math.sin(currStep/(85+j)))+j*70)*yBase*(Math.sin(10+currStep/10)+0.2)*Math.cos((currStep+j*55)/10)");
eval("document.all.a"+j+".style.left=Xpos+Math.sin((20*Math.sin(currStep/85))+j*70)*xBase*(Math.sin(10+currStep/(10+j))+0.2)*Math.cos((currStep+j*55)/10)");
}
currStep += step;
setTimeout("littlejewels()", 10) ;
}
}

// -->
</script>

<STYLE TYPE="text/css">
<!-- Change width and height to the size of your graphic
#a1 {position:absolute; left:260; top:175; width:50; height:50; visibility:hidden;}
#a2 {position:absolute; left:288; top:175; width:50; height:50; visibility:hidden;}
#a3 {position:absolute; left:260; top:175; width:50; height:50; visibility:hidden;}
#a4 {position:absolute; left:288; top:175; width:50; height:50; visibility:hidden;}
#a5 {position:absolute; left:260; top:175; width:50; height:50; visibility:hidden;}
#a6 {position:absolute; left:288; top:175; width:50; height:50; visibility:hidden;}
// -->
</STYLE>

</head>

<script language="JavaScript">

<!--

startup(); littlejewels();

//-->

</script>




<!----is the image path correct???? If your images are in the same directory as the webpage, get rid of IMAGES/
<!----these are the images that fly around, you can change them, also if you want less than 6 just remove the DIV tags starting with a6

<DIV ID="a1"><img
src="images/awaken.gif"
height=50 width=50></DIV>

<DIV ID="a2"><img
src="images/awaken.gif"
height=50 width=50></DIV>

<DIV ID="a3"><img
src="images/awaken.gif"
height=50 width=50></DIV>

<DIV ID="a4"><img
src="images/awaken.gif"
height=50 width=50></DIV>

<DIV ID="a5"><img
src="images/awaken.gif"
height=50 width=50></DIV>

<DIV ID="a6"><img
src="images/awaken.gif"
height=50 width=50></DIV>


<!---- Add the main body of your webpage here