ホームページ > 記事 > ウェブフロントエンド > jqueryで要素をゆっくり消す方法
jquery では、fadeOut() メソッドを使用して、要素をゆっくりと消すことができます。このメソッドは、選択した要素の不透明度を徐々に変更することで、要素を徐々に非表示にすることができます。設定パラメーターは、要素が消える速度 構文 「要素オブジェクト.fadeOut(速度、各時点での要素の速度、実行後に実行されるパラメータ)」です。
このチュートリアルの動作環境: Windows10 システム、jquery3.2.1 バージョン、Dell G3 コンピューター。
jqueryでは、pictureオブジェクトを取得し、fadeOut()メソッドを使って、ゆっくりと画像を消していきます。
test.html という名前の新しい HTML ファイルを作成して、jquery がどのように画像をゆっくりと消すかを説明します。 pタグ内にimgタグを使って画像を作成し、jqueryメソッドを使って画像をゆっくり消していきます。 img タグの id 属性を mypic に設定します。これは主に、以下の id を通じて img オブジェクトを取得するために使用されます。
buttonタグを使用して「絵がゆっくり消える」という名前のボタンを作成します。 onclick クリック イベントをボタン ボタンにバインドし、ボタンがクリックされると、himg() 関数が実行されます。 hisg() 関数を作成し、関数内で id(mypic) を通じて画像オブジェクトを取得し、fadeOut() メソッドを使用してそれを低速に設定し、画像がゆっくりと消えるようにします。
#test.html ファイルをブラウザで開き、ボタンをクリックして効果を確認します。
概要:
1. test.html ファイルを作成します。
2. ファイルの p タグ内で、img タグを使用して画像を作成し、js 関数の実行をトリガーするボタン button を作成します。
3. jsタグ内に関数を作成し、その関数内で画像オブジェクトを取得し、fadeOut()メソッドでslowに設定し、画像がゆっくり消えるように設定します。
注意事項
fadeOut() メソッドのパラメータは遅い場合がありますが、画像が消えるまでの秒数 (ミリ秒単位) を設定することもできます。
推奨される関連ビデオ チュートリアル: jQuery ビデオ チュートリアル
以上がjqueryで要素をゆっくり消す方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。