Menu
um hello!!
i have found this code in the JavaScript source:
[url]http://javascript.internet.com/miscellaneous/fly.html
and i like it!! :p
only i am unable to correctly follow the instruction there ?
i dont know how to make sure if i entered the correct path for the images ive downloaded..
where should i put the images??
also im wonderin’ if its possible for the fly to move on the browser not just the page..
[CODE]dir[-2]="[COLOR=Red]/yourPathHere/[/COLOR]Mosca_5.gif";[/CODE][CODE]var answer = (bear.indexOf('does a bear'))? true : false;[/CODE][CODE]------------------------------------------------
/*
Original: Stefano Occhetti
E-mail: [email protected]
Web Site: http://www.geocities.com/starnuto_di_topo_2001
*/
var answer = (bear.indexOf('does a bear'))? true : false;
var ns = (document.layers)?1:0;
/*
Button:
this code is to show a "button" to switch
the fly ON/OFF.
It is always shown on the frame's
bottom-right corner.
------------------------------------------------
*/
var imgwidth=40; // Image width
var imgheight=40; // Image height
var button = Array(); // to pre-cache images
button[0]=new Image();
etc.[/CODE]/*
Original: Stefano Occhetti
E-mail: [email protected]
Web Site: http://www.geocities.com/starnuto_di_topo_2001
Rewritten by Stephen Chapman for use with version 5+ browsers
http://javascript.about.com
*/
/* cross browser functions copyright Stephen Chapman */
function mouseX(evt) {if (!evt) evt = window.event; if (evt.pageX) return evt.pageX; else if (evt.clientX)return evt.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft); else return 0;}
function mouseY(evt) {if (!evt) evt = window.event; if (evt.pageY) return evt.pageY; else if (evt.clientY)return evt.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop); else return 0;}
function pageWidth() {return window.innerWidth != null? window.innerWidth: document.body != null? document.body.clientWidth:null;}
function pageHeight() {return window.innerHeight != null? window.innerHeight: document.body != null? document.body.clientHeight:null;}
function posLeft() {return typeof window.pageXOffset != 'undefined' ? window.pageXOffset:document.documentElement.scrollLeft? document.documentElement.scrollLeft:document.body.scrollLeft? document.body.scrollLeft:0;}
function posTop() {return typeof window.pageYOffset != 'undefined' ? window.pageYOffset:document.documentElement.scrollTop? document.documentElement.scrollTop: document.body.scrollTop?document.body.scrollTop:0;}
function posRight() {return posLeft()+pageWidth();} function posBottom() {return posTop()+pageHeight();}
function objWidth(objectID) {var obj = document.getElementById(objectID); if(obj.offsetWidth) return obj.offsetWidth; if (obj.clip) return obj.clip.width; return 0;}
function objHeight(objectID) {var obj = document.getElementById(objectID,0); if(obj.offsetHeight) return obj.offsetHeight; if (obj.clip) return obj.clip.height; return 0;}
/*
Button:
this code is to show a "button" to switch
the fly ON/OFF.
It is always shown on the frame's
bottom-right corner.
------------------------------------------------
*/
var imgwidth=40; // Image width
var imgheight=40; // Image height
var button = Array(); // to pre-cache images
button[0]=new Image();
button[0].src="img/Mosca_OFF.gif";
button[1]=new Image();
button[1].src="img/Mosca_ON.gif";
//Initialize some variables to make the button always to appear on the frame's bottom-right corner
document.write("<div id='FlyOnOff' style='position:absolute; visibility:show; left:235px; top:-50px; z-index:2'><img onclick='showhideAnimation()' id='Button' src='"+button[0].src+"' width='"+imgwidth+"' height='"+imgheight+"' border='0'></div>");
// Moves the button in the right position
function checkLocation() {
document.getElementById('FlyOnOff').style.left = (posRight() - imgwidth - 30) + 'px';
document.getElementById('FlyOnOff').style.top = (posBottom() - imgheight - 20) + 'px';
}
/*
Fly:
this code provides some facilities
to show a fly moving on the screen.
<i> </i>The fly does not actually follow the
<i> </i>mouse, but a "Dot" (not shown!).
------------------------------------------------
*/
document.onmousemove=getMousePosition;
var Dot_Ro=60; //Dot's distance from the mouse pointer
var Dot_Theta=0; //Dot's initial angle
var Dot_Direction=1; //Dot's direction (1=clockwise)
var Dot_x=0; //Dot's original position
var Dot_y=0;
var picX = 20; //Fly's coords.
var picY = 100;
var mX = 0; //Mouse coords.
var mY = 0;
var step = 10; //Pixels
var speed = 100;//u-seconds
// Dir specifies the right picture;
// img pre-caches images.
var dir = Array();
dir[-4]="Mosca_3.gif";
dir[-3]="Mosca_4.gif";
dir[-2]="Mosca_5.gif";
dir[-1]="Mosca_6.gif";
dir[0]="";
dir[1]="Mosca_2.gif";
dir[2]="Mosca_1.gif";
dir[3]="Mosca_8.gif";
dir[4]="Mosca_7.gif";
var img = Array();
for (var i=-4; i<5; i++){
img[i]=new Image();
img[i].src="img/"+dir[i];
}
// Some HTML code to show the fly.
<i> </i>document.write("<div id='FlyDiv' style='position:absolute'><img id='flyImg' src=" + img[1].src + "></div>");
function getMousePosition(e) {
mY=mouseY(e);
mX=mouseX(e);
}
//Shows or hides the fly when the "button" is pressed
function showhideAnimation() {
document.getElementById('FlyDiv').style.visibility = document.getElementById('FlyDiv').style.visibility=="hidden"?"visible":"hidden";
document.getElementById('Button').src = document.getElementById('FlyDiv').style.visibility=="hidden"?button[1].src:button[0].src;
}
// Moves the fly around the screen
function moveFly() {
checkLocation()
// moves the fly in a new position...
Dot_Theta+=Dot_Direction*Math.PI/15;
Dot_x=mX+Dot_Ro*Math.cos(Dot_Theta);
Dot_y=mY+Dot_Ro*Math.sin(Dot_Theta);
var mult = (Dot_x - picX < 0)? -1:1;
var alpha = Math.atan((Dot_y-picY) / (Dot_x-picX));
picX += (mult * step * Math.cos(alpha));
picY += (mult * step * Math.sin(alpha));
document.getElementById('FlyDiv').style.left = (picX - objWidth('flyImg')/ 2) +'px';
document.getElementById('FlyDiv').style.top = (picY - objHeight('flyImg')/ 2) + 'px';
<i> </i>// ... and changes the image.
<i> </i>alpha=(-180*alpha/Math.PI)+22.5;
<i> </i>var i = 0;
<i> </i>while(alpha>-Math.PI+45*i)i++;
<i> </i>document.getElementById('flyImg').src = img[mult*(i+1)].src;
<i> </i>}
function ChangeDotDirection() {
Dot_Direction=-Dot_Direction;
Dot_Theta+=Math.PI;
}
setInterval('moveFly()', speed);
setInterval('ChangeDotDirection()', speed*50);0.1.9 — BETA 5.19