Firefoxとクロームでフェードインにならない

横並びの画像を3枚時間差でフェードイン（左から順に表示）させたいのですが、
ＩＥでは問題無く動くのですがFirefoxとGoogle Chromeではフェードインにも透過にもならず画像がそのままパっとでてしまいます・・。

FirefoxとGoogle Chrome対策ソース、他に良い方法などございましたら
ご教授いただけますでしょうか。宜しくお願いいたします！


<script type="text/JavaScript"> // 画像のフェードイン・フェードアウト
var myspd = 5; // 変化する速さ（ミリ秒単位）
var myx = 10; // 何%ずつ変化させるか
var mypic = new Array("px1","px2","px3"); // 画像のname（順番に並べる）
var mycnt = 0;
var myp = 0;

function mygo() {
document.images[mypic[myp]].filters['alpha'].opacity = mycnt;
mycnt += myx;
if(mycnt >= 100) {
mycnt = 0;
myp++;
}
if(mypic.length <= myp) return;
setTimeout("mygo()",myspd);
}
</script>


【ＨＴＭＬ】


<ul>

<li><img src="image/mainpx_01.jpg" name="px1" width="365" height="484" style="display: inline; filter:alpha(opacity=2);" /></li>

<li><img src="image/mainpx_02.jpg" name="px2" width="365" height="484" style="display: inline; filter:alpha(opacity=0);" /></li>

<li><img src="image/mainpx_03.gif" name="px3" width="270" height="484" style="display: inline; filter:alpha(opacity=0);" /></li>

</ul>

No.1 回答者： fujillin 回答日時： 2012/10/01 15:26

理由としては、

＞filters['alpha'].opacity
はＩＥ専用のコードなので、たのブラウザは対応していないから。


一般的なブラウザではcssのopacityを設定することで、透明度を変えられます。

http://miyana2m.blog2.fc2.com/blog-entry-341.html
http://www.webbibo.com/blog/htmlcss/opacity.html
http://www.ne.jp/asahi/hatakeyama/design/csslayo …

この回答への補足

ありがとうございます。
ＣＳＳでの対応の仕方はわかるのですがＪＳでの対応のソースの
書き方がわかりません・・。
初心者なもので・・
ご教授いただければ有難いです・・！

補足日時：2012/10/02 14:35

この回答へのお礼

一度打ち切りまして新しく立ち上げなおしますね～！
ありがとうございました！

お礼日時：2012/10/02 15:35