sticky 利用
当ブログでは､本文記事がサイドバーより長くなる事はあまりない｡（汗）
本文記事が長かった場合は､サイドバー下が空白でスクロールされる事になる｡
そこでCSSで「sticky」を導入してみた｡ 事例は映画『糸』の記事を参照下さい｡
今使っているテンプレート（GirlOnWire）は未対応なので､プラグインの配置を入れ替え､
（かなり強引に）試行錯誤しながらやってみました｡（IE11は非対応）
【スポンサーリンク】本文記事が長かった場合は､サイドバー下が空白でスクロールされる事になる｡
そこでCSSで「sticky」を導入してみた｡ 事例は映画『糸』の記事を参照下さい｡
今使っているテンプレート（GirlOnWire）は未対応なので､プラグインの配置を入れ替え､
（かなり強引に）試行錯誤しながらやってみました｡（IE11は非対応）
参考サイト：【22-4】スクロールしていくとピタッと固定する position: sticky
「最新記事紹介」欄を追従表示したかったので､プラグインカテゴリ１から２に移動し
プラグインカテゴリ２をサイドバーから独立させ､「sticky」が効くように調整しました｡
本当は、カルーセルにも適用したいのだが､ヘッダーで使っている
背景画像を連動出来ないので諦めました｡［追記］参照
逆に､本文記事が長い場合に､下部 pager に「sticky」をセットしたら､
ちょっと､見すぼらしくなってしまった（笑）→ 後日､top幅を多めに設定し直しました｡
［他の修正］
① サイトバーのメニューの一部をブラグインカテゴリ３に移動し､フッターで表示するようにしました｡
参考サイト：横並びの画像やコンテンツを簡単にレスポンシブ表示する方法
② コメント･トラックバック欄を開閉式に変更
［追記］（2020.9.5.） カルーセルの「sticky」設定
headerを別に作り､各記事にはそちらを表示させる事により､背景を切り分けました｡
只､そのままのサイズだと､本文記事が読み辛いので縮小しました｡
逆に､footerに移動して､下部で固定した方が､読み易いかな...
イメージはこちらのサイト 参考サイト：BANGER!!!
「最新記事紹介」欄を追従表示したかったので､プラグインカテゴリ１から２に移動し
プラグインカテゴリ２をサイドバーから独立させ､「sticky」が効くように調整しました｡
背景画像を連動出来ないので諦めました｡
逆に､本文記事が長い場合に､下部 pager に「sticky」をセットしたら､
ちょっと､見すぼらしくなってしまった（笑）→ 後日､top幅を多めに設定し直しました｡
［他の修正］
① サイトバーのメニューの一部をブラグインカテゴリ３に移動し､フッターで表示するようにしました｡
参考サイト：横並びの画像やコンテンツを簡単にレスポンシブ表示する方法
② コメント･トラックバック欄を開閉式に変更
［追記］（2020.9.5.） カルーセルの「sticky」設定
headerを別に作り､各記事にはそちらを表示させる事により､背景を切り分けました｡
只､そのままのサイズだと､本文記事が読み辛いので縮小しました｡
逆に､footerに移動して､下部で固定した方が､読み易いかな...
イメージはこちらのサイト 参考サイト：BANGER!!!
- 関連記事
-
-
コメントを含めたブログ内検索
2010/06/13
-
月別記事一覧 改良
2012/10/12
-
構造化データマークアップ
2016/09/19
-
｢ユーザータグを記事ごとに表示｣
2008/03/08
-
【続きを読む】の開閉位置
2008/11/01
-
ユーザータグ一覧 （２）
2015/05/11
-
表示速度改善 ［２］
2010/03/30
-
｢ブログ内検索｣
2008/12/11
-
個別記事にアイコン付加他 カスタマイズ３件
2010/12/26
-
