jquery - 画像をフェードインおよびフェードアウトしますか?

Question

画像を 40% から 100% の間で常にフェードインおよびフェードアウトさせるにはどうすればよいですか?

CSS3の不透明度を作ってみたのですが、0%と100%しか対応していないので、あまり薄くなりません。

これを作る方法はありますか？

Answer 1

CSS Opacity は全範囲をサポートしています...

10進数形式のみ。

編集: クロスブラウザーの不透明度を追加しました。

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
filter: alpha(opacity=40);
-moz-opacity: 0.4;
-khtml-opacity: 0.4;
opacity:0.4;

Answer 2

これは、この状況に jQuery を適用する方法です。

フェードアウト 40%

function fadOut() {
    $('img').animate({'opacity':'0.4'}, 500); // 500 is the time in milliseconds
}

100% にフェードイン

function fadIn() {
    $('img').animate({'opacity':'1.0'}, 500); // 500 is the time in milliseconds
}

常に実行するには、試してください

var timer = setTimeout(fadOut, 1000); // after every 1 sec it will fadOut

clearTimer(timer); // to clear the timer

Answer 3

エイドリアンが言ったことは正しいですが、もしあなたが私のようで CSS が苦手な場合は、TwitterBootstrapを使用できます。そこにあるフェード クラスやその他の優れた機能が、もう少し役立つかもしれません。