|
↑
Background Effects >>>
An alien spacecraft hovers around the background of the page using JavaScript and DHTML. Best used with a space background.
Step 1: Add the below code to the <body> section of your page:
<SCRIPT
LANGUAGE="JavaScript">
document.body.background="space.jpg";
var
isNS =
((navigator.appName
==
"Netscape")
&&
(parseInt(navigator.appVersion)
>=
4));
var
pic1=document.getElementById("pic1").style;
var
_all =
'';
var
_style =
'';
var
wwidth,
wheight;
var
ydir =
'++';
var
xdir =
'++';
var
id1,
id2,
id3;
var
x
=
1;
var
y
=
1;
var
x1,
y1;
if(!isNS)
{
_all='all.';
_style='.style';
}
function
getwindowsize()
{
clearTimeout(id1);
clearTimeout(id2);
clearTimeout(id3);
if
(isNS)
{
wwidth
=
window.innerWidth
-
55;
wheight
=
window.innerHeight
-
50;
}
else
{
wwidth
=
document.body.clientWidth
-
55;
wheight
=
document.body.clientHeight
-
50;
}
id3
=
setTimeout('randomdir()',
20000);
animate();
}
function
randomdir()
{
if
(Math.floor(Math.random()*2))
{
(Math.floor(Math.random()*2))
?
xdir='--':
xdir='++';
}
else
{
(Math.floor(Math.random()*2))
?
ydir='--':
ydir='++';
}
id2
=
setTimeout('randomdir()',
20000);
}
function
animate()
{
eval('x'+xdir);
eval('y'+ydir);
if
(isNS)
{
pic1.left
=
x+pageXOffset;
pic1.top
=
y+pageYOffset;
}
else
{
pic1.pixelLeft
=
x+document.body.scrollLeft;
pic1.pixelTop
=
y+document.body.scrollTop;
}
if
(isNS)
{
if
(parseInt(pic1.top)
<=
5+pageYOffset)
ydir =
'++';
if
(parseInt(pic1.top)
>=wheight+pageYOffset)
ydir =
'--';
if
(parseInt(pic1.left)
>=
wwidth+pageXOffset)
xdir =
'--';
if
(parseInt(pic1.left)
<=
5+pageXOffset)
xdir =
'++';
}
else
{
if
(pic1.pixelTop
<=
5+document.body.scrollTop)
ydir =
'++';
if
(pic1.pixelTop
>=
wheight+document.body.scrollTop)
ydir =
'--';
if
(pic1.pixelLeft
>=
wwidth+document.body.scrollLeft)
xdir =
'--';
if
(pic1.pixelLeft
<=
5+document.body.scrollLeft)
xdir =
'++';
}
id1
=
setTimeout('animate()',
30);
}
window.onload=getwindowsize;
window.onresize=getwindowsize;
</script>
|
Step 2: The script uses two images as part of its interface. You can create your own, or use the two below (resized for easier download):
(right click images, and select "Save Image As")
Upload them into the same directory as your webpage.
→ baca manga online: Komiku tv
|