Sample Source
Macintosh用 Netscape(R) Communicator 4.7 で動作確認をしています。
このページのＳｏｕｒｃｅです。Ｃｏｐｙ＆Ｐａｓｔして使ってください。
戻る Ｒｅｔｕｒｎ
sample03に比べ画像を８枚設定できるようになりました。
あまり画像を大きくすると
訳がわかんなくなりますョ
ソースはこの下です
<Script Language="JavaScript">
<!--
var sakuraKazu=7;
var ax=new Array(),ay=new Array();
ax[0]=4,ay[0]=4;
ax[1]=8,ay[1]=-10;
ax[2]=-9,ay[2]=-12;
ax[3]=5,ay[3]=-7;
ax[4]=-2,ay[4]=8;
ax[5]=4,ay[5]=4;
ax[6]=8,ay[6]=-10;
ax[7]=-9,ay[7]=-12;
var xMax=1500;
var yMax=1500;
var sakuraSpeed=50;
function sakuraSet(name,x,y) {
if (document.all) {
document.all(name).style.posLeft+=x;
document.all(name).style.posTop+=y;
}
else if (document.getElementById) {
document.getElementById(name).style.left=parseInt(document.getElementById(name).style.left)+x;
document.getElementById(name).style.top=parseInt(document.getElementById(name).style.top)+y;
}
else if (document.layers) document.layers[name].moveBy(x,y);
}
function sakuraGet(name,flag) {
if (document.all) {
if (flag=="x") return document.all(name).style.posLeft;
if (flag=="y") return document.all(name).style.posTop;
if (flag=="w") return document.all(name).style.posWidth;
if (flag=="h") return document.all(name).style.posHeight;
}
else if (document.getElementById) {
if (flag=="x") return parseInt(document.getElementById(name).style.left);
if (flag=="y") return parseInt(document.getElementById(name).style.top);
if (flag=="w") return parseInt(document.getElementById(name).style.width);
if (flag=="h") return parseInt(document.getElementById(name).style.height);
}
else if (document.layers) {
if (flag=="x") return document.layers[name].left;
if (flag=="y") return document.layers[name].top;
if (flag=="w") return document.layers[name].clip.width;
if (flag=="h") return document.layers[name].clip.height;
}
}
function sakuraGetWin(flag) {
if (document.all) {
if (flag=="xStart") return document.body.scrollLeft;
if (flag=="xEnd") return document.body.scrollLeft+document.body.clientWidth;
if (flag=="yStart") return document.body.scrollTop;
if (flag=="yEnd") return document.body.scrollTop+document.body.clientHeight;
}
else if (document.getElementById) {
if (flag=="xStart") return window.scrollX;
if (flag=="xEnd") return window.scrollX+innerWidth;
if (flag=="yStart") return window.scrollY;
if (flag=="yEnd") return window.scrollY+innerHeight;
}
else if (document.layers) {
if (flag=="xStart") return pageXOffset;
if (flag=="xEnd") return pageXOffset+innerWidth;
if (flag=="yStart") return pageYOffset;
if (flag=="yEnd") return pageYOffset+innerHeight;
}
}
function move(){
if (document.all || document.getElementById || document.layers) {
var name,x,y,w,h;
var xStart=sakuraGetWin("xStart");
var xEnd=sakuraGetWin("xEnd");
var yStart=sakuraGetWin("yStart");
var yEnd=sakuraGetWin("yEnd");
for (var i=0;i<=sakuraKazu;i++) {
name="sakura"+i;
sakuraSet(name,ax[i],ay[i]);
x=sakuraGet(name,"x");
y=sakuraGet(name,"y");
w=sakuraGet(name,"w");
h=sakuraGet(name,"h");
if (x>=xStart && x+ax[i]<=xStart) ax[i]=-ax[i];
if (x+w<=xEnd && x+w+ax[i]>=xEnd) ax[i]=-ax[i];
if (y>=yStart && y+ay[i]<=yStart) ay[i]=-ay[i];
if (y+h<=yEnd && y+h+ay[i]>=yEnd) ay[i]=-ay[i];
if (x<0 || x>xMax) ax[i]=-ax[i];
if (y<0 || y>yMax) ay[i]=-ay[i];
}
setTimeout("move()",sakuraSpeed);
}
}
// End -->
</Script>
</HEAD>
<SPAN id="sakura0" style="position:absolute; left:0px; top:0px; width:xxpx; height:xxpx; clip:rect(0,xx,xx,0)"> //画像の設定
<IMG SRC="xxxxx.gif" WIDTH="xx" HEIGHT="xx" NATURALSIZEFLAG="3" ALIGN="BOTTOM"></SPAN> //画像の設定
<SPAN id="sakura1" style="position:absolute; left:50px; top:xxpx; width:xxpx; height:25px; clip:rect(0,xx,xx,0)">
<IMG SRC="xxxxx.gif" WIDTH="xx" HEIGHT="xx" NATURALSIZEFLAG="3" ALIGN="BOTTOM"></SPAN>
<SPAN id="sakura2" style="position:absolute; left:100px; top:100px; width:xxpx; height:xxpx; clip:rect(0,xx,xx,0)">
<IMG SRC="xxxxx.gif" WIDTH="xx" HEIGHT="xx" NATURALSIZEFLAG="3" ALIGN="BOTTOM"></SPAN>
<SPAN id="sakura3" style="position:absolute; left:150px; top:150px; width:xxpx; height:xxpx; clip:rect(0,xx,xx,0)">
<IMG SRC="xxxxx.gif" WIDTH="xx" HEIGHT="xx" NATURALSIZEFLAG="3" ALIGN="BOTTOM"></SPAN>
<SPAN id="sakura4" style="position:absolute; left:0px; top:0px; width:xxpx; height:xxpx; clip:rect(0,xx,xx,0)">
<IMG SRC="xxxxx.gif" WIDTH="xx" HEIGHT="xx" NATURALSIZEFLAG="3" ALIGN="BOTTOM"></SPAN>
<SPAN id="sakura5" style="position:absolute; left:50px; top:50px; width:xxpx; height:xxpx; clip:rect(0,xx,xx,0)">
<IMG SRC="xxxxx.gif" WIDTH="xx" HEIGHT="xx" NATURALSIZEFLAG="3" ALIGN="BOTTOM"></SPAN>
<SPAN id="sakura6" style="position:absolute; left:100px; top:100px; width:xxpx; height:xxpx; clip:rect(0,xx,xx,0)">
<IMG SRC="xxxxx.gif" WIDTH="xx" HEIGHT="xx" NATURALSIZEFLAG="3" ALIGN="BOTTOM"></SPAN>
<SPAN id="sakura7" style="position:absolute; left:150px; top:150px; width:xxpx; height:xxpx; clip:rect(0,xx,xx,0)">
<IMG SRC="xxxxx.gif" WIDTH="xx" HEIGHT="xx" NATURALSIZEFLAG="3" ALIGN="BOTTOM"></SPAN>
<Script Language="JavaScript">
<!--
move();
// End -->
</Script>