1

Web サイトのロゴにフェードイン効果を追加しました。

#logo img {
    opacity: 0;
    -moz-transition: opacity 5s; /* Firefox 4 */
    -webkit-transition: opacity 5s; /* Safari and Chrome */
    -o-transition: opacity 5s;
    transition: opacity 5s;
}

<div id="logo"><p><a href="index.html"><img src="img/logo.png" ... onload="this.style.opacity='1';" /></a></p></div>

一見すると、うまく機能しているように見えます。しかし、2 ページ目 (3 ページ目、...) ではロゴが表示されるだけで、IE9、FireFox 19、Opera 12 ではフェードインしません。フェードイン効果は Safari 5 と Chrome 25 でのみ利用できます。すべてのページ。

私は Web デザインをすることはほとんどありませんが、CSS で遊んでいるときに偶然見つけた機能があると便利です。年に 1 回も使わない jQuery のような大きなライブラリの使い方を学び始めるのは適切ではないと思います。

すべてのページで他のブラウザと連携させる簡単な方法はありますか?

4

1 に答える 1

0

あなたのコメントに基づいて、これはうまくいくかもしれません:

 animation: fadein 2s;
-moz-animation: fadein 2s; /* Firefox */
-webkit-animation: fadein 2s; /* Safari and Chrome */
-o-animation: fadein 2s; /* Opera */

IEのサポートが必要な場合は、jQueryを使用する必要があります。

于 2013-03-14T08:02:53.997 に答える