最初のp要素をクリックすると、透明度0.33に遷移していくようにします。
2番目のp要素は変わりませんので、濃さを比較してください。
Effects/API/jQuery
fadeTo(speed, opacity, [callback])
各要素の透明度を、指定した値まで徐々に変化させる効果を与えます。
アニメーション効果は指定したスピードで実行されます。
速度は、”slow”、”normal”、”fast”、もしくは完了までの時間をミリ秒単位で指定します。例えば”1500”であれば、1.5秒かけてアニメーションが行われます。
到達する透明度は、1を100%の濃度(透過しない状態)、0を完全に透明な状態として指定します。例えば0.33であれば、これは33%の見え方になります。
また、効果が完了した際に呼び出される関数を第三引数に指定することも出来ます。
アニメーション効果は指定したスピードで実行されます。
速度は、”slow”、”normal”、”fast”、もしくは完了までの時間をミリ秒単位で指定します。例えば”1500”であれば、1.5秒かけてアニメーションが行われます。
到達する透明度は、1を100%の濃度(透過しない状態)、0を完全に透明な状態として指定します。例えば0.33であれば、これは33%の見え方になります。
また、効果が完了した際に呼び出される関数を第三引数に指定することも出来ます。
サンプル
サンプル1
<p> Click this paragraph to see it fade. </p> <p> Compare to this one that won't fade. </p>
$("p:first").click(function () { $(this).fadeTo("slow", 0.33); });
[全コードを表示]
[実行結果を単体で表示]