[jQuery]jquery.colorbox.jsとjquery.smoothScroll.js(ページ内リンクスクロール)を共存させるためのこと+α

colorboxはそれ単体だと優秀なんだけど、ページ内リンクのスムーススクロールとの相性が悪すぎる。

環境

とりあえず

検索すれば結構ヒットする「data-tor-smoothScroll=”noSmooth”」は意味なかった。
前のバージョンだったら出来たんだろうか。

SmoothScrollをいじる

colorboxで使いたいaタグをこう書いたとする

<a class="colorbox" href="#colorbox">colorbox link</a>

jquery.smoothScroll.jsの85行目に

$("a.colorbox").unbind('click');

を入れる。
つまり55行目から始まる「return this.each( function( i, e ) {」の最後に入れる。

ついでにページ内リンク押した時にURLにつく「#~」を削る

jquery.smoothScroll.jsは今時珍しくURLにidが付いて気になってしょうがない。
jquery.smoothScroll.jsの76行目を削除ないしコメントアウトする。
というかfunctionにそれしか入ってないから75~77行を削ればいい。

↓これ。

function() {
location.hash = targetHash;
}

まとめ

大元のファイルをいじらないといけないのは、直だるい。

コメント

タイトルとURLをコピーしました