実装方法: 1. querySelector() を使用して指定された要素オブジェクトを取得します; 2. "element object.style.opacity = Math.sin(2 * Math.PI * time)" ステートメントを使用して制御しますフェードインまたはフェードアウト効果; 3. 再帰を使用して、連続的なフェードインおよびフェードアウトを実現します。
このチュートリアルの動作環境: Windows7 システム、JavaScript バージョン 1.8.5、Dell G3 コンピューター。
#Javascript は連続的なフェードインとフェードアウトを実装します。
スコープが [0,1] の周期関数を見つけるだけで済みます。 ]。周期関数の値を不透明度の属性値として使用して、フェードインまたはフェードアウト効果を制御します。 再帰を使用してフェードインとフェードアウトを続けます。 実装コード:<h1 id="text">床前明月光,疑是地上霜。</h1> <script type="text/javascript"> var duration = 3000; var startTime = new Date(); var p = 0; requestAnimationFrame(function f(){ //获取到元素 var el = document.querySelector("#text"); var time = ( new Date - startTime ) / duration; el.style.opacity = Math.sin(2 * Math.PI * time); requestAnimationFrame(f); });
JavaScript 上級チュートリアル ]
以上がJavaScriptで連続的なフェードインとフェードアウトを実現する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。