Bootstrapタイプのテンプレート

Bootstrap?ライブラリをベースとしたテンプレート?です。レスポンシブウェブデザイン?に対応し、デスクトップの大きなモニタからスマートフォンの小さなモニタまでコンテンツサイズとレイアウトが自動調整されます。
画面上部に横型のナビゲーションバー、サイドにサブメニューを配置します。
サイドポジションに配置するウィジェットはポジションの組み合わせによって、画面のスクロールに合わせてスクロールさせたり、固定表示させることが可能です。

template_bootstrap2.png

サイドポジション

ポジション名「ポジション-xxxxx」のxxxxx部分で動作が規定されます。

  • fixed - 画面のスクロール状況に関わらず、常に固定表示します。
  • hide - 「指定なし」と動作は同じで、画面サイズが一定のサイズよりも小さくなると非表示になります。
  • slide - 画面のスクロールに合わせて画面トップ位置までスクロールし、画面トップに来ると固定表示に切り替わります。
  • 指定なし - 画面のスクロール状況に従います。

組み合わせパターン

  • 指定なし+slide - 画面のスクロールに合わせて、全体がslideに配置したウィジェットが先頭に来るまでスクロールし、以降slideポジションのみが表示されます。
template_bootstrap1.png