![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?e8efa67)
横並びの画像を3枚時間差でフェードイン(左から順に表示)させたいのですが、
IEでは問題無く動くのですが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>
【HTML】
<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>
A 回答 (1件)
- 最新から表示
- 回答順に表示
No.1
- 回答日時:
理由としては、
>filters['alpha'].opacity
はIE専用のコードなので、たのブラウザは対応していないから。
一般的なブラウザでは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 …
この回答への補足
ありがとうございます。
CSSでの対応の仕方はわかるのですがJSでの対応のソースの
書き方がわかりません・・。
初心者なもので・・
ご教授いただければ有難いです・・!
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- JavaScript 画像の表示位置 3 2022/12/23 08:25
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- JavaScript jQueryでのドラッグアンドドロップについて 1 2022/07/30 09:10
- JavaScript clear機能を失わずにファイルアップロード機能を作成したい 3 2023/06/10 16:12
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- HTML・CSS CSS のみのタブ切り替えについて 1 2023/01/11 16:47
- JavaScript ソースコードのいじる場所が分かりません。 1 2022/12/23 02:06
- JavaScript 1日1回引けるJavaScriptおみくじについて 1 2022/12/12 22:28
- JavaScript アップロードファイルの種類によって処理を分岐させたいのですが書き方が分からずアドバイスお願いします 4 2023/06/17 19:12
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
[jQuery]bxSlider 一番最後と...
-
前回の質問の続き
-
MAX関数を使ってからLEFT JOIN...
-
jspでcssが読み込めない
-
1枚の画像をクリックすると複数...
-
フッター上部に謎の隙間
-
iframe内のリンクが飛ばないの...
-
MFCで画像を表示させているので...
-
表示・非表示のスクリプトで、...
-
getElementByIdの戻り値がnull...
-
appendChildでのデフォルト値
-
【javascript】ロールオーバー...
-
iframe内のリンク文字のマウス...
-
jQueryでのドラッグアンドドロ...
-
bxsliderで最初に縦に複数表示...
-
指定したフォルダの画像を一括...
-
JavaScript で flexslider の画...
-
「画像クリックで音声再生」を ...
-
画像の重なりの順序を代える方...
-
複数bxsliderをタブで切り替え...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
Slick.jsのオプションrtlについて
-
同一ページ内の複数のタグに同...
-
【jQuery】2分割レイアウトで、...
-
キャラクターがぴょこんと飛び...
-
画像をフェードアウト&フェー...
-
jqueryのプラグインslickの画像...
-
html5に変えるとスライドショー...
-
Javaスクリプトで画像を縦にス...
-
high slideをFC2ブログで
-
ご教授ください。
-
jQueryでタブ、スライダーを使...
-
チェックボックスと画像切替の連動
-
jQueryのclickイベントハンドラ
-
javascriptで文字サイズの変更
-
fontsize.jsでhtmlの大中小の設...
-
【iOS及びAndroid】リンク画像...
-
Firefoxとクロームでフェードイ...
-
javascript src書き換え
-
神経衰弱 順番に裏返し
-
アコーディオンメニューが開い...
おすすめ情報