ホームページ > 記事 > ウェブフロントエンド > ページの読み込み時にブートストラップ モーダルを自動的に起動するにはどうすればよいですか?
ページの読み込み時にブートストラップ モーダルを自動的に起動するにはどうすればよいですか?
- Mary-Kate Olsenオリジナル
- 2024-10-19 16:00:31946ブラウズ
ページの読み込み時にブートストラップ モーダルを自動的に起動する
ブートストラップのドキュメントには、JavaScript を使用してページの読み込み時にモーダルを起動するためのソリューションが提供されています。ただし、この言語に慣れていない人にとって、実装は困難になる可能性があります。
簡単な方法の 1 つは、ドキュメントのヘッド セクション内で jQuery ロード イベントを使用することです。このイベント内で目的のモーダルをラップすると、ページの読み込み時に自動的に表示されます:
<code class="javascript">$(window).on('load', function() {
$('#myModal').modal('show');
});</code>
このコードの使用例は次のとおりです:
<code class="html"><head>
<script>
$(window).on('load', function() {
$('#myModal').modal('show');
});
</script>
</head>
<body>
<div class="modal" id="myModal">...</div>
</body></code>
load イベントを使用しているにもかかわらず場合でも、次の HTML を使用してページ内でモーダルを起動できます:
<code class="html"><a class="btn" data-toggle="modal" href="#myModal">Launch Modal</a></code>
これらの手順に従うことで、ユーザーはページの読み込み時に自動的に、またはページ内の指定されたリンクを介してブートストラップ モーダルを簡単に起動できます。
以上がページの読み込み時にブートストラップ モーダルを自動的に起動するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。