画像を順にフェードインフェードアウトで表示
ＨＰのＴｏｐページのw900×h300位のスペースに
順に画像をフェードインフェードアウトしながら表示させ,最後の画像でストップさせたい
Flashムービーを作成するのは簡単なのですが、iPadに対応しない為
jQueryなどで表示させたいのですが、javaが全然わからず困っています。
一応下記のように自分で調べてみて見つけた、近いものを作っては見たものの
<script language="JavaScript"><!--
myImageCnt = 7; // 画像の数
myImage = new Array( // 画像ファイル名の設定
"img/main/f01.jpg",
"img/main/f02.jpg",
"img/main/f03.jpg",
"img/main/f04.jpg",
"img/main/f05.jpg",
"img/main/f06.jpg",
"img/main/f07.jpg"
);
myNowCnt = 0; // 現在表示している画像番号
function myChange(){ // 定期的に画像を更新する関数
if (myNowCnt == myImageCnt-1){ // 最後の画像まで表示したのなら
myNowCnt=0; // 最初の画像に戻す
}else{ // 最後の画像まで表示していないのなら
myNowCnt++; // 次の画像へ
}
document.myFormImg.src = myImage[myNowCnt]; // 次の画像を表示する
setTimeout( "myChange()" , 6000 ); // ２秒周期に画像を更新する
}
// --></script>
<img src="img/main/f01.jpg" width="900" height="300" name="myFormImg">
<script language="JavaScript"><!--
myChange();
// --></script>
こんな感じでやってみたもののこれではフェードインフェードアウトにはなりません
どこに何を足せばいいのか、または全く違うコードを書けばいいのかどなたかお教えいただけませんでしょうか。
jQueryだと記述はもっと簡単なのでしょうか？
![その他([技術者向] コンピューター) イメージ](https://gazo.okwave.jp/okwave/spn/images/related_qa/c205_1_thumbnail_img_sm.png)
