[解決済み] Bootstrap Carousel : 自動スライドを解除する
2022-06-15 14:57:52
質問
Bootstrap Carouselを使用しています。 私がしたいのは、ナビゲーションまたはページネーションがクリックされたときにのみスライダーがスライドすることです。 私は削除しようとしました
$('.carousel').carousel({
interval: 6000
});
動作は問題ないのですが、問題は一度クリックしたナビゲーションやページネーションが自動スライドするようになってしまったことです。自動スライド機能を削除することは可能でしょうか?もし可能であれば、どのようにすればよいですか?
どのように解決するのですか?
jsとhtml(簡単)の2つの方法があります。
- js経由
$('.carousel').carousel({
interval: false,
});
これは、ミリ秒が追加されていないため、自動スライドが停止し、次のスライドが行われないようにするものです。
-
Html 経由
を追加することで
data-interval="false"
を追加しdata-ride="carousel"
<div id="carouselExampleCaptions" class="carousel slide" data-ride="carousel">
になります。
<div id="carouselExampleCaptions" class="carousel slide" data-interval="false">
webMan さんのコメントに基づいて更新しました。
関連
-
[解決済み】JavaScriptでインラインIF文の書き方は?
-
OSSアップロードエラーを解決する: net::ERR_SSL_PROTOCOL_ERROR
-
[解決済み] 配列から特定の項目を削除するにはどうすればよいですか?
-
[解決済み] JavaScriptの配列で一意な値をすべて取得する(重複を排除する)。
-
[解決済み] Twitter Bootstrapのメニューをクリックではなく、ホバーでドロップダウンさせる方法
-
[解決済み] Twitter Bootstrap 3を使用して列を中央に配置する
-
[解決済み] BootstrapのモーダルウィンドウをjQueryで開くには?
-
[解決済み] IEでデベロッパーツールを一度開いただけで、JavaScriptが動作するのはなぜですか?
-
[解決済み】オブジェクトからプロパティを削除する(JavaScript)
-
[解決済み】Twitter Bootstrapのツールチップを動的に作成された要素に結合するにはどうすればよいですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
Vueの要素ツリーコントロールに破線を追加する説明
-
vue ディレクティブ v-html と v-text
-
Vueの「データを聴く」原則を解説
-
[解決済み] テスト
-
[解決済み】Node.js getaddrinfo ENOTFOUND
-
[解決済み】JavaScriptエラー(Uncaught SyntaxError: Unexpected end of input)
-
[解決済み】ReactJSでエラー発生 Uncaught TypeError: Super expression は null か関数でなければならず、undefined ではありません。
-
Uncaught TypeError: null のプロパティ 'offsetHeight' を読み取れませんでした。
-
JSクリックイベント - Uncaught TypeError: プロパティ 'onclick' に null を設定できません。
-
JavaScriptのgetElementById()メソッド入門