WEB相談室

Webページ作成に関しての何でも掲示板です。

タイトル:画像の移動しながら画像の大きさを変えるには

0:[投稿] tosio [MAIL] [2004/03/05 16:36 ][環境:winxp わからない]

ご指導をよろしくお願いします。
早速ですが、下記のように記述して、
月の画像を移動しながら小さくなっていくようにと思って取り組んでおりますが、縦方向は小さくなるのですが、横方向が全然変わりません、何度なくやり変えてみましたが、うまくゆきません。
やっとこのページにたどり着き是非ご指導をお願いします。

<SCRIPT language=JavaScript >
<!--
timeID=0;
var yp0 = 200;//月縦のスタート
var yp1 = 10;//月縦の終点
var xp0 = 5;//月横のスタート
var xxw;//画像横小さくしたときの横の値 代入変数
var yyh;//画像横小さくしたときの縦の値 代入変数
var avre = 0;
function  tuki(){
   xxw = document.test.width;//月画像横幅取得
   yyh = document.test.height;//月画像縦長さ取得
   avre = yp0 % 4;//画像と小さくする時の条件計算

if(yp1 <= yp0){
   if(avre == 0){
       xxw -= 1;//画像横小さくするる
       yyh -= 1;//画像縦小さくするる
       }
document.test.Width = xxw;//画像の横幅代入
document.test.height = yyh;//画像の縦の長さ代入
document.my1Form.TM1.value = xxw;//確認のため画像横幅を表示
document.my2Form.TM2.value = yyh;//確認のため画像縦幅を表示
document.all["L1"].style.pixelTop = yp0;
document.all["L1"].style.pixelLeft = xp0;
yp0 -= 1;//画像 再度表示 縦方向移動距離計算
xp0 += 2;//画像 再度表示 横方向移動距離計算
document.all["L1"].style.display = "block";//移動する月を表示
setTimeout("tuki()",30)
}
}
//-->
</SCRIPT>
<img src="tuki1.gif" id="L1" name="test" style="POSITION: absolute;display:block; zindex:6;TOP:200px;LEFT:5px;width:150px;hight:150px">
<DIV style="top : 14px;left : 8px;position : absolute;z-index : 17;" id="Layer2">
<P><EMBED src="MTK.mid" autostart="true" hidden="true" loop="true"></P></DIV>
<DIV style="top : 101px;left : 8px;position : absolute;z-index : 15;" id="Layer4">
<form name="my1Form">画像横幅 &lt; PIX;<input type="text" name="TM1"></form></DIV>
<DIV style="top : 138px;left : 8px;position : absolute;z-index : 14;" id="Layer5">
<form name="my2Form">画像高さ&gt; PIX;<input type="text" name="TM2"></form></DIV>


1:[回答] モモンガ [2004/03/07 20:59 ]

回答ではないですが、こういう時ってずらずら全部書くより、
大きさを変える部分だけ切り出して書いたほうが答えるほうは楽です。


試してないけど、

<script>
var img;
var minSize = 10; // 最小サイズ
var diff = 5;

function run()
{
   img = document.images["moon"];
   alert(img);
   setTimeout("chSize()",30);
}


function chSize()
{
   if(img.height - diff > minSize)
   {
       img.height = img.width -= diff;
       setTimeout("chSize()",30);
   }
   
}
</script>
<body onLoad="run()">
<img name="moon" width=100 height=100>


2:[完了] としお [MAIL] [2004/03/08 12:07 ]

モモンガ様
ご指導ありがとうございました。
少し手こずりましたが、
やっと移動しながら縮小できました。
助かりました。
本当にパソコンの世界は奥が深いと痛感しております。
お手数をおかけしましたが、
こらからも、ご指導をお願いします。

回答(必須): 状態:

お名前(必須):

e-mail:

URL:




[戻る]

ChaichanPAPA's World