jQueryを2秒後に消す方法-フロントエンドQ&A-php.cn

jQueryを2秒後に消す方法

WBOY

リリース： 2022-01-10 16:49:22

オリジナル

1613 人が閲覧しました

jquery では、2 秒後に要素が消える効果を実現するために、lay() 関数と Hide() 関数を使用できます。キュー内の次の項目 Hide() 関数選択した要素を非表示にするために使用され、構文は "$(element).lay(2000).hide(200)" です。

jQueryを2秒後に消す方法

このチュートリアルの動作環境: Windows10 システム、jquery3.2.1 バージョン、Dell G3 コンピューター。

jquery が 2 秒後に消える仕組み

Delay() メソッドは、キュー内の次の項目の実行の遅延を設定します。

構文

$(selector).delay(speed,queueName)

ログイン後にコピー

パラメータ

speed オプション。ディレイの速さを指定します。可能な値: ミリ秒、「遅い」、「速い」

queueName オプション。キューの名前を指定します。デフォルトは「fx」、標準のエフェクトキューです。

hide() メソッドは、選択した要素を非表示にします。

ヒント: これは、CSS プロパティの display:none に似ています。

注: 非表示の要素は完全には表示されません (ページのレイアウトには影響しません)。

ヒント: 非表示の要素を表示するには、show() メソッドを確認してください。

文法

$(selector).hide(speed,easing,callback)

ログイン後にコピー

例は次のとおりです:

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
    $(function(){
        $("#dianji").click(function(){
            $("#disappare").delay(2000).hide(200);
        });
    })
</script>
</head>
<body>
    <div id="content">
        <button id="dianji">点击</button>
        <div id="disappare">
            <p>点击2秒后会自动消失</p>
        </div>
    </div>
</body>
</html>

ログイン後にコピー

出力結果:

jQueryを2秒後に消す方法