indexhibit_V2カスタマイズその3
スムーススクロールを導入するためのメモ
まずは連番id間のスクロール、最終的にはTumblrのテーマである syndex(http://syndex.me/)
のような動きを実現したい。
syndexのソースを覗いてみるとplugins.jsがあって
中身は
- jQuery.ScrollTo http://flesler.blogspot.jp/2007/10/jqueryscrollto.html
- jQuery.LocalScroll http://flesler.blogspot.jp/2007/10/jquerylocalscroll-10.html
- Infinite Scroll jQuery plugin http://www.infinite-scroll.com/infinite-scroll-jquery-plugin
みたいなので上2つを使えばとりあえずスクロールはできそう。
課題
idの連番作成
plugin.jsの中身はちゃんと確認できてないけれども
ページ内リンクでスクロールさせる場合div idなどに連番をつける必要があると思う。
php側で自動で連番付けるのが理想だが、自分には敷居が高いのでJSで同一クラスにidとナンバリング挿入するスクリプトでできそう。
追記
http://webdesignerwall.com/tutorials/scrollto-posts-with-jquery
この辺りの作例見るとクラス指定するだけで特に連番id作ってるわけではなさそうなので、この処理は必要ない気がする。
クリックごとに、画像切替&下層レイヤーのサムネール位置へとスクロール
サムネール画像をクリックするとモーダルウインドウでオーバーレイ表示され、
クリックごとに、画像切替&下層レイヤー上のサムネール位置へのスクロールされる。
lightbox系スクリプトを書き換える必要があるんじゃないかと思う。(グループ表示しやすいcolorboxを使う予定)