• RSS
Bootstrap でリンククリック時にcollapseメニューを閉じる処理

Bootstrap で、.navbar-collapse 内のメニューリンクをクリック(タップ)して同一ページのアンカーポイントへ移動すると同時に、.collapse メニューを閉じる処理についてメモ。
続きを読む

Bootstrap のCollapse の開閉速度を調整する方法

アコーディオンメニューを簡単に実現できるBootstrapCollapse ですが、開閉速度を早くしたり遅くしたり、自由に調整したい場合の処理の方法です。
続きを読む

Bootstrap でModal(モーダルボックス)を使う方法

入力フォームの確認フェイズなどでも使えそうな、Bootstrap の Modal 機能のご紹介です。

普段はモーダルボックスは display:none で隠しておき、ボタンをクリックしてモーダルボックスを起動(表示)させるイメージになります。
続きを読む

Bootstrap で「ドロップダウンメニュー」を実装する方法

サイトやブログのヘッダーにドロップダウン型のメニューを設置することもあると思いますが、Bootstrap を使えばオンクリックによるドロップダウンメニューを簡単に実装することができます。
続きを読む

Bootstrap のタブメニューを Cookie に保存して記憶させる方法

Bootstrap を使ったシンプルなタブメニューの実装方法です。

今回はタブメニューの基本的な設置方法と合わせて、jQuery Cookie を利用して現在閲覧しているタブの情報を Cookie に保存する方法も合わせて紹介させていただきます。

これにより、ページをリロードしたり離脱して戻ってきた場合でも、タブの情報を保持できるようになります。
続きを読む

Bootstrap のLightbox プラグイン「Bootstrap Lightbox」

Bootstrap のモーダル機能ベースの「Bootstrap Lightbox」は、画像をクリックしてオーバーレイで拡大表示させるシンプルなLightbox 系プラグインです。

Colorbox や Fancybox のようにあれもこれも出来るという訳ではなさそうですが、今後使う可能性もあるので簡単に設置方法をまとめました。
続きを読む