追加のナビゲーション（接辞）ウィジェットブートストラップとは?

Q: 追加のナビゲーション（接辞）ウィジェットブートストラップとは?

追加のナビゲーション（接辞）プラグインができますの<div>ページ上の特定の位置に固定します。 また、オンまたはプラグインの間にスイッチを使用してオフにすることができます。 一般的な例は、社会的なアイコンです。 彼らは、特定の位置で開始されますが、ときにタグのページをクリックし、<div>要素ではなく、ページのスクロールの残りの部分と、位置にロックされます。

Bootstrap コース
Bootstrap CSS
Bootstrap レイアウトコンポーネント
Bootstrap ウィジェット
Bootstrap 他の

追加のナビゲーション（接辞）ウィジェットブートストラップ2024 年の最新の入門チュートリアル。このコースでは使用法,例,例,CSSのポジショニングにより、,オプション, について学習できます。

追加のナビゲーション（接辞）ウィジェットブートストラップ

前：カルーセルブートストラップ（カルーセル）ウィジェット

次へ：v2のチュートリアルブートストラップ

追加のナビゲーション（接辞）プラグインができますの<div>ページ上の特定の位置に固定します。また、オンまたはプラグインの間にスイッチを使用してオフにすることができます。一般的な例は、社会的なアイコンです。彼らは、特定の位置で開始されますが、ときにタグのページをクリックし、<div>要素ではなく、ページのスクロールの残りの部分と、位置にロックされます。

あなたは、個々のプラグイン機能を参照したい場合は、affix.jsを参照する必要があります。 または、ブートストラッププラグインの概要章で述べたように、あなたはbootstrap.jsまたはbootstrap.min.jsの圧縮バージョンを参照することができます。

使用法

あなたは、属性データ、または（接辞）プラグインをナビゲートするために追加のJavaScriptを使用してすることができます。

データ属性を通っ：ナビゲーション（接辞）動作に追加の要素を追加するには、自分だけがデータスパイ=を監視する要素を追加する必要があり、「貼り付け」することができます。ロック要素を定義するためのオフセットとするとき、モバイルスイッチに使用します。
例
次の例では、データ属性の使用による追加のナビゲーション（接辞）ウィジェットの使用方法を示しています。
例
<！DOCTYPE HTML> <HTML> <ヘッド> <メタ文字セット = "UTF-8"> <タイトル>追加のナビゲーションブートストラップ（接辞）ウィジェット </タイトル> <リンク RELは = "スタイルシート" href = "http://cdn.static.w3write.com/libs/bootstrap/3.3.7/css/bootstrap.min.css"> <スクリプト SRC = "http://cdn.static.w3write.com/libs/jquery/2.1.1/jquery.min.js"> </スクリプト> <スクリプト SRC = "http://cdn.static.w3write.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"> </スクリプト> <スタイル>
/ *カスタムスタイル* / ULの .nav-タブ{ 幅： 140ピクセル ;マージントップ： 20ピクセル ;ボーダー半径： 4ピクセル ;ボーダー： 1ピクセル固体 #ddd ;ボックスシャドウ： 0 1ピクセル 4ピクセル RGBA（0、0、0、 0.067） ;} UL .nav-タブ李 { マージン： 0 ;ボーダートップ： 1ピクセル固体 #ddd ;} UL .nav-タブ李：最初の子{ border-top：なし ;} UL .nav-タブリー { マージン： 0 ;パディング： 8ピクセル 16ピクセル ;ボーダー半径： 0 ;} UL .nav-タブ李 .active 、ULは.nav-タブ李 .active A：ホバー{ 色： #FFF ;背景：＃0088cc ;ボーダー： 1ピクセル固体＃0088cc ;} UL .nav-タブ李：最初の子 { 国境半径： 4ピクセル 4ピクセル 0 0 ;} UL .nav-タブ李：最後の子 { 国境半径： 0 0 4ピクセル 4ピクセル ;} UL .nav-タブ.affix { トップ： 30ピクセル ; / *の先頭位置を設定固定要素を* / }
</スタイル> </ HEAD> <ボディデータスパイ = "スクロール" データターゲット = "#myScrollspy"> <DIV クラス = "コンテナ"> <DIV クラス = "ジャンボトロン"> <H1>ブートストラップ接辞</ H1 > </ DIV> <DIV クラス = "行"> <DIV クラス= "COL-XS-3 」 ID = "myScrollspy"> <UL クラス= "NAV NAV-タブナビゲーション -stacked」データスパイ = "貼ります" データ・オフセット・トップ= "125 "> <李クラス = "アクティブ"> <A href = "＃セクション-1" > 最初の部分 </ A> </ LI> <李> <A href = "＃セクション-2" > 第二部 </ A> </ LI> <李> <A href = "＃セクション-3" > パートIII </ A> </ LI> <李> <A href = "＃セクション-4" > パートIV </ A> </ LI> <李> <A href = "＃セクション-5" > パートV </ A> </ LI> </ UL> </ DIV> <DIV クラス= "COL-XS-9 "> <H2 ID = "セクション-1"> 最初の部分 </ H2> <P> Loremのイプサムの嘆きAMET座る、consecteturのadipiscingのELITを。ナムEU SEM tempor、でバリウスQUAMは、DUIをluctus。Maurisマグナmetus、dapibusのNECのturpisのVEL、ゼンパーmalesuadaアンティ。前庭ID metus交流nislビバンダムscelerisque非非プルス。Suspendisse バリウスNIBH非aliquet sagittis。tinciduntので orci前庭elementumをAMET座る。aliquamでARCUでVivamusのファーメンタム。Quisque aliquamポルタodioでアトリ属。Vivamus nislレオ、ビバンダムEUでblandit、tristique egetの笑い。整数aliquet QUAM UT ELIT suscipit、IDのinterdum neque porttitor。整数faucibus小舌。< / P> <P>前庭はQUAM UTマグナQUIS consequat faucibus。Pellentesque egetのNiSi A MI suscipitのtincidunt。ユタテンパスの格言の笑い。Pellentesque viverra sagittis QUAM mattisで。Suspendisseのpotenti。Aliquamは妊婦のNIBH、facilisisの妊婦のodioをAMET座る。ラクスのblanditでPhasellusのauctorのvelit 、commodo iaculisフストviverra。Etiam履歴書 estのARCU。Mauris VEL congue嘆き。aliquam egetマイルmiです。FusceのQUAMのtortor、commodo交流DUIのQUIS、ビバンダムviverra ERAT。マエケナスmattis lectus enim、QUIS tincidunt DUI molestie euismod。CurabiturらDIAM tristique、 NUNC EU、hendrerit TELLUS accumsan。< / P> <HR> <H2 ID = "セクション-2"> 第二セクション </ H2> <P> Nullam hendreritフスト非レオ aliquet imperdiet。Etiamでsagittis lectus。Suspendisse ultrices placerat accumsan。Mauris QUIS dapibus orci。でdapibus velit blandit pharetra tincidunt。Quisque非SAPIEN NECのラクスcondimentumのfacilisis utのiaculis enim。セッドviverra interdumビバンダム。〜している間交流sollicitudinの嘆き。アトリ属履歴書のラクスのsed rutrumで。Phasellus congueの前庭の小舌のsed consequatます。</ p> <P>前庭はラクス、scelerisque consectetur交流ファーメンタムのloremののconvallisはsedの。ナムodioのtortor、格言QUIS malesuada pellentesque履歴書のorci、で。Vivamus elementumを、EUのauctorのlobortis、DIAM velit性排出物ラクスをフェリスurna QUISアンティmetusファーメンタムをQUIS。セッドfacilisisでリベロ。スペルマsociis natoque penatibusらmagnis DIS分娩モンテス、nascetur ridiculusエーカー。前庭ビバンダムblandit嘆き。ヌンクのorciの嘆き、hendreritのtinciduntのアンティ、中molestie NECのNIBH。Vivamus SEM augue、モリスornare augue、中hendrerit非SAPIENます。</ p > <HR> <H2 ID = "セクション-3"> パートIII </ H2> <P>整数視床枕レオのid笑いの pellentesque前庭。セッドのDIAMのリベロは、sodales eget SAPIEN VEL、porttitorビバンダムenim。〜している間は、NECのアンティにNIBH履歴書のloremののporttitorのblanditをsedの。Pellentesque履歴書のmetusイプサム。PhasellusはNUNC交流のSEM malesuadaのcondimentumをsedの。Etiamの中でaliquam lectus。ナムVELのSAPIENのDIAM。〜している間pharetra IDをARCUのegetのblandit。Proin imperdiet mattis augue porttitorインチQuisqueテンパスenimのid lobortisのfeugiat。プルスの切れ込みのporttitorでSuspendisse tincidunt笑いQUIS嘆きアトリ属blandit。ユタsedのSAPIEN。Nullamは、フェリスA iaculis pretiumのornare、悲しみのnislのゼンパーのtortor、ヴェルsagittisラクスEST consequatエロス。セッドのid pretiumのnisl。Curabiturの嘆きのnisl、laoreet履歴書のaliquamのID、tinciduntはAMET座るmaurisます。</ p> <P> Phasellus履歴書のsuscipitのフスト。 Mauris pharetra feugiatアンティのid切れ込み。accumsanのtinciduntでEtiam faucibus maurisのid temporの排出物。Duis luctus turpis。Phasellusの笑いの笑い、volutpatのヴェルのTELLUS交流、tinciduntアトリ属マッサ。Etiam hendrerit嘆きegetアンティrutrum adipiscing。 CRAS interdumイプサムのmattis、テンパスのmaurisのVEL 、ゼンパーイプサム。Duis sedの嘆きのUT enim lobortis pellentesque ultricies交流小舌。pellentesque convallis ELITにNiSi、ID vulputateイプサムUT ullamcorper。CRAS交流視床枕のプルスは、交流viverra EST。Suspendisseのpotenti。整数pellentesque nequeらelementumのテンパス。小舌のUTの中Curabiturのビバンダム rhoncusます。</ p> <P> Quisqueのpharetra velit IDがvelitは pretiumをiaculis。Nullamフストsedの小舌ポルタsempreがEU QUIS enim。Pellentesqueのpellentesque、facilisisのhendreritでmetus、lectusのvelitのfacilisisレオ、QUIS volutpat turpis ARCU QUIS enim。NULLA viverra Loremのelementum interdum ultricies。Suspendisse accumsan QUAM NECアンティモリステンパス。morbusの複数形 VELのaccumsanのDIAM、eget convallis TELLUS。Suspendisseのpotentiます。</ p> <HR> <H2 ID = "セクション-4"> パートIV </ H2> <P> Suspendisseがorciのfacilisis、 dignissimのtortor履歴書は、ultrices miです。前庭A iaculisラクス。Phasellus履歴書のconvallisの小舌、NECのvolutpatのTELLUS。Vivamus scelerisqueモリスnisl、NEC vehicula ELIT性排出物。セッドluctusのmetus IDをマイル妊婦は、faucibus convallis neque pretium。マエケナスQUIS SAPIEN UTレオのアトリ属の tempor履歴書レオをAMET座る。〜している間imperdietテンパスplacerat。Pellentesque視床枕ultrices NUNC sedのultrices。morbusの複数形VELマイルpretium、ファーメンタムラクスら、viverra TELLUS。Phasellus sodalesリベロNECのDUIのconvallis、AMET座るファーメンタムSAPIEN auctor 。前庭アンティイプサムprimis faucibus orciで luctusらultricesお問い合わせ今cubilia Curae ;.セッドEUのelementumのNIBH、QUISバリウスリベロます。</ p> <P>前庭はQUAM UTマグナQUIS consequat faucibus。Pellentesque egetのNiSi A MI suscipitのtincidunt。ユタテンパスの格言の笑い。Pellentesque viverra sagittis QUAM mattisで。Suspendisseのpotenti。Aliquamは妊婦のNIBH、facilisisの妊婦のodioをAMET座る。ラクスのblanditでPhasellusのauctorのvelit 、commodo iaculisフストviverra。Etiam履歴書 estのARCU。Mauris VEL congue嘆き。aliquam egetマイルmiです。FusceのQUAMのtortor、commodo交流DUIのQUIS、ビバンダムviverra ERAT。マエケナスmattis lectus enim、QUIS tincidunt DUI molestie euismod。CurabiturらDIAM tristique、 NUNC EU、hendrerit TELLUS accumsan。< / P> <P> Phasellusファーメンタム、neque座っ enimアンティinterdumエロス、eget luctusイプサムエロスutの小舌。ヌンクornare ERAT QUIS faucibus molestie、sodalesのtemporをAMET。Proin malesuadaのconsequatのcommodoを。Mauris iaculis、エロスUT dapibus luctus、マッサenim elementumプルス、座りますAMET tristiqueのプルスプルスのNECのフェリス。morbusの複数形 QUAMのDIAMで前庭SAPIEN egetポルタ視床枕。ナム。Proin rhoncus、フェリスelementum accumsan格言、フェリスのNiSi前庭のTELLUSらultrices笑いフェリスでorci。Quisque前庭のSEM nisl、ヴェルcongueレオ格言のNEC。 velit sagittis ullamcorper VELでCRASのegetの東側らlectus。HAC habitasseのplateaのdictumstで。Etiam interdum iaculis velit、ヴェルsollicitudin LoremのfeugiatはAMET座る。Etiam luctus、QUAM SED sodales aliquam、Loremのリベロhendrerit urna、faucibus rhoncusマッサNIBHフェリスで。Curabitur 交流テンパスのNULLA、UTゼンパーERAT。 Vivamusポルタullamcorper SEM、ornare性排出物mauris facilisisのidます。</ p> <P>のUT UTの笑いのnisl。 Fusceのporttitorのエロスマグナluctus、非congueのNULLAのeleifendで。Aenean porttitorのfeugiatの嘆きfacilisisをAMET座る。Pellentesque venenatisマグナら笑いcommodo、commodoのturpisの妊婦。ナム・モリスマッサdapibus urna aliquet、QUIS iaculis ELIT sodales。セッドeget ornare orci、EUは suscipit malesuadaフスト。ヌンクラクスのaugue、格言QUIS DUI IDを、切れ込みのcongueのQUAM。NULLA SEM SEM、aliquamのNECの嘆きの交流は、テンパスconvallis NUNC。interdumらmalesuadaのFAME交流アンティイプサムprimisでfaucibus。NULLA convallis iaculis。Quisque eget commodoの小舌。 PraesentレオのDUI、中facilisisのQUISのeleifend、aliquet履歴書のNUNC。Suspendisseのファーメンタムのodio交流マッサultricies pellentesque。Fusce EU suscipitマッサます。</ p> <HR> <H2 ID = "セクション-5"> パートV </ H2> <P>ナムegetのプルスのNEC東側 consectetur vehicula。Nullamは、中viverraリベロ性排出物はAMET座るnisl笑いをultrices。Etiam porttitor嘆き非エロス視床枕malesuada。前庭が非laoreet ARCU AMET ESTモリスNULLAテンパスaliquet。Praesent luctus hendrerit座る。morbusの複数形consequat placerat マグナ、sedの交流ornareのodioのsagittis。〜まで履歴書のullamcorperのプルス。Vivamus非metus交流フストのポルタ・volutpatます。</ p> <P> Vivamus mattis accumsan ERAT、ヴェルconvallis笑いpretium NEC。整数NUNCのNULLA、viverra UT SEM以外、scelerisque vehicula ARCU。Fusceビバンダムconvallis augue lobortisをAMET座る。CRASポルタurna turpisは、lobortisのプルスのadipiscing IDをsodales。マエケナスullamcorper、turpisをsuscipit pellentesqueアトリ属、マッサラクス視床枕マイル、dapibusのTELLUSでNEC dignissimのvelitのARCUのegetプルス。ナム、egetのeuismodのnisl。ユタeget venenatis SAPIEN。Vivamus vulputateバリウスmauris、VELのバリウスnislのfacilisis交流。NULLA aliquetフストA NIBH ornare、EUのcongue rutrum nequeます。</ p> <P> Suspendisseがorciのfacilisis、 dignissimのtortor履歴書は、ultrices miです。前庭A iaculisラクス。Phasellus履歴書のconvallisの小舌、NECのvolutpatのTELLUS。Vivamus scelerisqueモリスnisl、NEC vehicula ELIT性排出物。セッドluctusのmetus IDをマイル妊婦は、faucibus convallis neque pretium。マエケナスQUIS SAPIEN UTレオのアトリ属の tempor履歴書レオをAMET座る。〜している間imperdietテンパスplacerat。Pellentesque視床枕ultrices NUNC sedのultrices。morbusの複数形VELマイルpretium、ファーメンタムラクスら、viverra TELLUS。Phasellus sodalesリベロNECのDUIのconvallis、AMET座るファーメンタムSAPIEN auctor 。前庭アンティイプサムprimis faucibus orciで luctusらultricesお問い合わせ今cubilia Curae ;.セッドEUのelementumのNIBH、QUISバリウスリベロます。</ p> <P> morbusの複数形のsedファーメンタムイプサム。 morbusの複数形A orci vulputate tortor ornare blandit A QUIS orci。〜している間aliquam sodales妊婦。UTのullamcorperのNiSiのでは、交流pretiumのvelit。前庭履歴書のlectusのvolutpat、consequatのLoremのは、AMET視床枕のTELLUS座る。tinciduntのVELレオでeget視床枕。エロス非ラクスのCurabitur malesuadaのaliquamを。Praesentらテンパスodio。整数QUAMのNUNC。HAC habitasseのplateaのdictumstで。aliquamのポルタ・NIBHのNULLAらmattis turpis placerat eget。pellentesqueのDUIのDIAM、pellentesqueヴェル妊婦のid、EUのマグナaccumsan 。ゼンパーのARCUわかるsed、UT dignissimレオます。</ p> <P> sedの履歴書のlobortisのDIAM、 ID molestieマグナ。Aliquam consequatイプサムQUIS estの格言ultrices。Aenean NIBHのvelit、DIAMのIDでアトリ属、blandit hendreritラクス。〜している間vehicula rutrum TELLUS egetファーメンタム。Pellentesque交流ERATらARCU ornare tincidunt。AliquamのERAT volutpat。Vivamus lobortis urna QUIS妊婦ゼンパー。condimentumで、東側A faucibus luctus、MI悲しみ毎日の祈りの規則的順序マイル、ID vehicula ARCU笑いA NIBH。Pellentesque blandit SAPIENラクス、ヴェルvehicula NUNC feugiat AMET座るます。</ p> </ DIV> </ DIV> </ DIV> </ BODY> </ HTML>

»をお試しください
結果は以下の通りであります：

JavaScriptの場合：次のように、要素JavaScriptを手動で追加したナビゲーション（接辞）を追加することができます。
```
$（ '＃のMyAffix'）。接辞（{
   オフセット：{
	  トップ：100、底部：関数（）{
		 リターン（this.bottom = 
			$（ '。BS-フッター'）。OuterHeight（真））
		 }
	  }
}）
```
例
次の例では、JavaScriptの使用を介して、追加のナビゲーション（接辞）ウィジェットの使用方法を示しています。
例
<！DOCTYPE HTML> <HTML> <ヘッド> <メタ文字セット = "UTF-8"> <タイトル>追加のナビゲーションブートストラップ（接辞）ウィジェット </タイトル> <リンク RELは = "スタイルシート" href = "http://cdn.static.w3write.com/libs/bootstrap/3.3.7/css/bootstrap.min.css"> <スクリプト SRC = "http://cdn.static.w3write.com/libs/jquery/2.1.1/jquery.min.js"> </スクリプト> <スクリプト SRC = "http://cdn.static.w3write.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"> </スクリプト> <スタイル>
/ *カスタムスタイル* / ULの .nav-タブ{ 幅： 140ピクセル ;マージントップ： 20ピクセル ;ボーダー半径： 4ピクセル ;ボーダー： 1ピクセル固体 #ddd ;ボックスシャドウ： 0 1ピクセル 4ピクセル RGBA（0、0、0、 0.067） ;} UL .nav-タブ李 { マージン： 0 ;ボーダートップ： 1ピクセル固体 #ddd ;} UL .nav-タブ李：最初の子{ border-top：なし ;} UL .nav-タブリー { マージン： 0 ;パディング： 8ピクセル 16ピクセル ;ボーダー半径： 0 ;} UL .nav-タブ李 .active 、ULは.nav-タブ李 .active A：ホバー{ 色： #FFF ;背景：＃0088cc ;ボーダー： 1ピクセル固体＃0088cc ;} UL .nav-タブ李：最初の子 { 国境半径： 4ピクセル 4ピクセル 0 0 ;} UL .nav-タブ李：最後の子 { 国境半径： 0 0 4ピクセル 4ピクセル ;} UL .nav-タブ.affix { トップ： 30ピクセル ; / *の先頭位置を設定固定要素を* / }
</スタイル> <スクリプト>
$（ドキュメント）。レディ（関数（）{$（ "#myNav」）。接辞（{ オフセット：{ トップ：125 } }）;}）;
</スクリプト> </ HEAD> <ボディデータスパイ = "スクロール" データターゲット = "#myScrollspy"> <DIV クラス = "コンテナ"> <DIV クラス = "ジャンボトロン"> <H1>ブートストラップ接辞</ H1 > </ DIV> <DIV クラス = "行"> <DIV クラス= "COL-XS-3 」 ID = "myScrollspy"> <UL クラス= "NAV NAV-タブナビゲーション -stacked」 ID = "myNav"> <李クラス = "アクティブ"> <A href = "＃セクション-1" > 最初の部分 </ A> </ LI> <李> <A href = "＃セクション-2" > 第二部 </ A> </ LI> <李> <A href = "＃セクション-3" > パートIII </ A> </ LI> <李> <A href = "＃セクション-4" > パートIV </ A> </ LI> <李> <A href = "＃セクション-5" > パートV </ A> </ LI> </ UL> </ DIV> <DIV クラス= "COL-XS-9 "> <H2 ID = "セクション-1"> 最初の部分 </ H2> <P> Loremのイプサムの嘆きAMET座る、consecteturのadipiscingのELITを。ナムEU SEM tempor、でバリウスQUAMは、DUIをluctus。Maurisマグナmetus、dapibusのNECのturpisのVEL、ゼンパーmalesuadaアンティ。前庭ID metus交流nislビバンダムscelerisque非非プルス。Suspendisse バリウスNIBH非aliquet sagittis。tinciduntので orci前庭elementumをAMET座る。aliquamでARCUでVivamusのファーメンタム。Quisque aliquamポルタodioでアトリ属。Vivamus nislレオ、ビバンダムEUでblandit、tristique egetの笑い。整数aliquet QUAM UT ELIT suscipit、IDのinterdum neque porttitor。整数faucibus小舌。< / P> <P>前庭はQUAM UTマグナQUIS consequat faucibus。Pellentesque egetのNiSi A MI suscipitのtincidunt。ユタテンパスの格言の笑い。Pellentesque viverra sagittis QUAM mattisで。Suspendisseのpotenti。Aliquamは妊婦のNIBH、facilisisの妊婦のodioをAMET座る。ラクスのblanditでPhasellusのauctorのvelit 、commodo iaculisフストviverra。Etiam履歴書 estのARCU。Mauris VEL congue嘆き。aliquam egetマイルmiです。FusceのQUAMのtortor、commodo交流DUIのQUIS、ビバンダムviverra ERAT。マエケナスmattis lectus enim、QUIS tincidunt DUI molestie euismod。CurabiturらDIAM tristique、 NUNC EU、hendrerit TELLUS accumsan。< / P> <HR> <H2 ID = "セクション-2"> 第二セクション </ H2> <P> Nullam hendreritフスト非レオ aliquet imperdiet。Etiamでsagittis lectus。Suspendisse ultrices placerat accumsan。Mauris QUIS dapibus orci。でdapibus velit blandit pharetra tincidunt。Quisque非SAPIEN NECのラクスcondimentumのfacilisis utのiaculis enim。セッドviverra interdumビバンダム。〜している間交流sollicitudinの嘆き。アトリ属履歴書のラクスのsed rutrumで。Phasellus congueの前庭の小舌のsed consequatます。</ p> <P>前庭はラクス、scelerisque consectetur交流ファーメンタムのloremののconvallisはsedの。ナムodioのtortor、格言QUIS malesuada pellentesque履歴書のorci、で。Vivamus elementumを、EUのauctorのlobortis、DIAM velit性排出物ラクスをフェリスurna QUISアンティmetusファーメンタムをQUIS。セッドfacilisisでリベロ。スペルマsociis natoque penatibusらmagnis DIS分娩モンテス、nascetur ridiculusエーカー。前庭ビバンダムblandit嘆き。ヌンクのorciの嘆き、hendreritのtinciduntのアンティ、中molestie NECのNIBH。Vivamus SEM augue、モリスornare augue、中hendrerit非SAPIENます。</ p > <HR> <H2 ID = "セクション-3"> パートIII </ H2> <P>整数視床枕レオのid笑いの pellentesque前庭。セッドのDIAMのリベロは、sodales eget SAPIEN VEL、porttitorビバンダムenim。〜している間は、NECのアンティにNIBH履歴書のloremののporttitorのblanditをsedの。Pellentesque履歴書のmetusイプサム。PhasellusはNUNC交流のSEM malesuadaのcondimentumをsedの。Etiamの中でaliquam lectus。ナムVELのSAPIENのDIAM。〜している間pharetra IDをARCUのegetのblandit。Proin imperdiet mattis augue porttitorインチQuisqueテンパスenimのid lobortisのfeugiat。プルスの切れ込みのporttitorでSuspendisse tincidunt笑いQUIS嘆きアトリ属blandit。ユタsedのSAPIEN。Nullamは、フェリスA iaculis pretiumのornare、悲しみのnislのゼンパーのtortor、ヴェルsagittisラクスEST consequatエロス。セッドのid pretiumのnisl。Curabiturの嘆きのnisl、laoreet履歴書のaliquamのID、tinciduntはAMET座るmaurisます。</ p> <P> Phasellus履歴書のsuscipitのフスト。 Mauris pharetra feugiatアンティのid切れ込み。accumsanのtinciduntでEtiam faucibus maurisのid temporの排出物。Duis luctus turpis。Phasellusの笑いの笑い、volutpatのヴェルのTELLUS交流、tinciduntアトリ属マッサ。Etiam hendrerit嘆きegetアンティrutrum adipiscing。 CRAS interdumイプサムのmattis、テンパスのmaurisのVEL 、ゼンパーイプサム。Duis sedの嘆きのUT enim lobortis pellentesque ultricies交流小舌。pellentesque convallis ELITにNiSi、ID vulputateイプサムUT ullamcorper。CRAS交流視床枕のプルスは、交流viverra EST。Suspendisseのpotenti。整数pellentesque nequeらelementumのテンパス。小舌のUTの中Curabiturのビバンダム rhoncusます。</ p> <P> Quisqueのpharetra velit IDがvelitは pretiumをiaculis。Nullamフストsedの小舌ポルタsempreがEU QUIS enim。Pellentesqueのpellentesque、facilisisのhendreritでmetus、lectusのvelitのfacilisisレオ、QUIS volutpat turpis ARCU QUIS enim。NULLA viverra Loremのelementum interdum ultricies。Suspendisse accumsan QUAM NECアンティモリステンパス。morbusの複数形 VELのaccumsanのDIAM、eget convallis TELLUS。Suspendisseのpotentiます。</ p> <HR> <H2 ID = "セクション-4"> パートIV </ H2> <P> Suspendisseがorciのfacilisis、 dignissimのtortor履歴書は、ultrices miです。前庭A iaculisラクス。Phasellus履歴書のconvallisの小舌、NECのvolutpatのTELLUS。Vivamus scelerisqueモリスnisl、NEC vehicula ELIT性排出物。セッドluctusのmetus IDをマイル妊婦は、faucibus convallis neque pretium。マエケナスQUIS SAPIEN UTレオのアトリ属の tempor履歴書レオをAMET座る。〜している間imperdietテンパスplacerat。Pellentesque視床枕ultrices NUNC sedのultrices。morbusの複数形VELマイルpretium、ファーメンタムラクスら、viverra TELLUS。Phasellus sodalesリベロNECのDUIのconvallis、AMET座るファーメンタムSAPIEN auctor 。前庭アンティイプサムprimis faucibus orciで luctusらultricesお問い合わせ今cubilia Curae ;.セッドEUのelementumのNIBH、QUISバリウスリベロます。</ p> <P>前庭はQUAM UTマグナQUIS consequat faucibus。Pellentesque egetのNiSi A MI suscipitのtincidunt。ユタテンパスの格言の笑い。Pellentesque viverra sagittis QUAM mattisで。Suspendisseのpotenti。Aliquamは妊婦のNIBH、facilisisの妊婦のodioをAMET座る。ラクスのblanditでPhasellusのauctorのvelit 、commodo iaculisフストviverra。Etiam履歴書 estのARCU。Mauris VEL congue嘆き。aliquam egetマイルmiです。FusceのQUAMのtortor、commodo交流DUIのQUIS、ビバンダムviverra ERAT。マエケナスmattis lectus enim、QUIS tincidunt DUI molestie euismod。CurabiturらDIAM tristique、 NUNC EU、hendrerit TELLUS accumsan。< / P> <P> Phasellusファーメンタム、neque座っ enimアンティinterdumエロス、eget luctusイプサムエロスutの小舌。ヌンクornare ERAT QUIS faucibus molestie、sodalesのtemporをAMET。Proin malesuadaのconsequatのcommodoを。Mauris iaculis、エロスUT dapibus luctus、マッサenim elementumプルス、座りますAMET tristiqueのプルスプルスのNECのフェリス。morbusの複数形 QUAMのDIAMで前庭SAPIEN egetポルタ視床枕。ナム。Proin rhoncus、フェリスelementum accumsan格言、フェリスのNiSi前庭のTELLUSらultrices笑いフェリスでorci。Quisque前庭のSEM nisl、ヴェルcongueレオ格言のNEC。 velit sagittis ullamcorper VELでCRASのegetの東側らlectus。HAC habitasseのplateaのdictumstで。Etiam interdum iaculis velit、ヴェルsollicitudin LoremのfeugiatはAMET座る。Etiam luctus、QUAM SED sodales aliquam、Loremのリベロhendrerit urna、faucibus rhoncusマッサNIBHフェリスで。Curabitur 交流テンパスのNULLA、UTゼンパーERAT。 Vivamusポルタullamcorper SEM、ornare性排出物mauris facilisisのidます。</ p> <P>のUT UTの笑いのnisl。 Fusceのporttitorのエロスマグナluctus、非congueのNULLAのeleifendで。Aenean porttitorのfeugiatの嘆きfacilisisをAMET座る。Pellentesque venenatisマグナら笑いcommodo、commodoのturpisの妊婦。ナム・モリスマッサdapibus urna aliquet、QUIS iaculis ELIT sodales。セッドeget ornare orci、EUは suscipit malesuadaフスト。ヌンクラクスのaugue、格言QUIS DUI IDを、切れ込みのcongueのQUAM。NULLA SEM SEM、aliquamのNECの嘆きの交流は、テンパスconvallis NUNC。interdumらmalesuadaのFAME交流アンティイプサムprimisでfaucibus。NULLA convallis iaculis。Quisque eget commodoの小舌。 PraesentレオのDUI、中facilisisのQUISのeleifend、aliquet履歴書のNUNC。Suspendisseのファーメンタムのodio交流マッサultricies pellentesque。Fusce EU suscipitマッサます。</ p> <HR> <H2 ID = "セクション-5"> パートV </ H2> <P>ナムegetのプルスのNEC東側 consectetur vehicula。Nullamは、中viverraリベロ性排出物はAMET座るnisl笑いをultrices。Etiam porttitor嘆き非エロス視床枕malesuada。前庭が非laoreet ARCU AMET ESTモリスNULLAテンパスaliquet。Praesent luctus hendrerit座る。morbusの複数形consequat placerat マグナ、sedの交流ornareのodioのsagittis。〜まで履歴書のullamcorperのプルス。Vivamus非metus交流フストのポルタ・volutpatます。</ p> <P> Vivamus mattis accumsan ERAT、ヴェルconvallis笑いpretium NEC。整数NUNCのNULLA、viverra UT SEM以外、scelerisque vehicula ARCU。Fusceビバンダムconvallis augue lobortisをAMET座る。CRASポルタurna turpisは、lobortisのプルスのadipiscing IDをsodales。マエケナスullamcorper、turpisをsuscipit pellentesqueアトリ属、マッサラクス視床枕マイル、dapibusのTELLUSでNEC dignissimのvelitのARCUのegetプルス。ナム、egetのeuismodのnisl。ユタeget venenatis SAPIEN。Vivamus vulputateバリウスmauris、VELのバリウスnislのfacilisis交流。NULLA aliquetフストA NIBH ornare、EUのcongue rutrum nequeます。</ p> <P> Suspendisseがorciのfacilisis、 dignissimのtortor履歴書は、ultrices miです。前庭A iaculisラクス。Phasellus履歴書のconvallisの小舌、NECのvolutpatのTELLUS。Vivamus scelerisqueモリスnisl、NEC vehicula ELIT性排出物。セッドluctusのmetus IDをマイル妊婦は、faucibus convallis neque pretium。マエケナスQUIS SAPIEN UTレオのアトリ属の tempor履歴書レオをAMET座る。〜している間imperdietテンパスplacerat。Pellentesque視床枕ultrices NUNC sedのultrices。morbusの複数形VELマイルpretium、ファーメンタムラクスら、viverra TELLUS。Phasellus sodalesリベロNECのDUIのconvallis、AMET座るファーメンタムSAPIEN auctor 。前庭アンティイプサムprimis faucibus orciで luctusらultricesお問い合わせ今cubilia Curae ;.セッドEUのelementumのNIBH、QUISバリウスリベロます。</ p> <P> morbusの複数形のsedファーメンタムイプサム。 morbusの複数形A orci vulputate tortor ornare blandit A QUIS orci。〜している間aliquam sodales妊婦。UTのullamcorperのNiSiのでは、交流pretiumのvelit。前庭履歴書のlectusのvolutpat、consequatのLoremのは、AMET視床枕のTELLUS座る。tinciduntのVELレオでeget視床枕。エロス非ラクスのCurabitur malesuadaのaliquamを。Praesentらテンパスodio。整数QUAMのNUNC。HAC habitasseのplateaのdictumstで。aliquamのポルタ・NIBHのNULLAらmattis turpis placerat eget。PellentesqueのDUIのDIAM、pellentesqueヴェル妊婦のid、EUのマグナaccumsan 。ゼンパーのARCUわかるsed、UT dignissimレオます。</ p> <P> sedの履歴書のlobortisのDIAM、 ID molestieマグナ。Aliquam consequatイプサムQUIS estの格言ultrices。Aenean NIBHのvelit、DIAMのIDでアトリ属、blandit hendreritラクス。〜している間vehicula rutrum TELLUS egetファーメンタム。Pellentesque交流ERATらARCU ornare tincidunt。AliquamのERAT volutpat。Vivamus lobortis urna QUIS妊婦ゼンパー。condimentumで、東側A faucibus luctus、MI悲しみ毎日の祈りの規則的順序マイル、ID vehicula ARCU笑いA NIBH。Pellentesque blandit SAPIENラクス、ヴェルvehicula NUNC feugiat AMET座るます。</ p> </ DIV> </ DIV> </ DIV> </ BODY> </ HTML>

»をお試しください
結果は以下の通りであります：

CSSのポジショニングにより、

追加のナビゲーション（接辞）プラグインモードで上記2では、CSSのポジショニングコンテンツを通過する必要があります。 .affix、.affixトップと.affixボトム：追加のナビゲーション（接辞）は、プラグイン3クラスの切り替え、各クラスには、特定の状態を示しています。これらの三つの状態（このプラグインに依存しない）のために独自のCSSを設定するには、次の手順に従ってください。

初めに、その最上位の位置に示すために、プラグイン.affixトップ要素を追加します。この時間は、任意のCSSのポジショニングを必要としません。
追加のナビゲーション（接辞）要素を追加することをスクロールすると、それは実際の追加のナビゲーション（接辞）をトリガする必要があります。（ブートストラップCSSコードによって提供される）;固定：この時点で.affixは.affixトップを交換し、位置を設定します。
あなたはオフセットの底を定義する場合、スクロールがこの位置に到達したときには、置き換え.affix底を.affix必要があります。オフセットはオプションですので、あなたはオフセットを設定した場合、適切なCSSを設定し、同時に必要とされます。この場合、必要なときに位置を追加します。絶対に;.

オプション

合格するためのデータ属性やJavaScriptを通していくつかのオプションがあります。次の表は、これらのオプションを示します：

选项名称	类型/默认值	Data 属性名称	描述
offset	number \| function \| object 默认值：10	data-offset	当计算滚动位置时，距离顶部的偏移像素。如果设置了一个数字，则该偏移量的值将被应用在顶部和底部。如果设置了一个对象偏移，则其值形如 offset: { top: 10 } 或 offset: { top: 10, bottom: 5 }。如果需要动态计算偏移，请使用函数。

前：カルーセルブートストラップ（カルーセル）ウィジェット

次へ：v2のチュートリアルブートストラップ

Bootstrap コース

Bootstrap CSS

Bootstrap レイアウトコンポーネント

Bootstrap ウィジェット

Bootstrap 他の