あめみか

「雨はいつもわたしのみかた。」 … 思想・哲学・世迷言からイラストまで、多岐にわたってたいへんくつに綴っています。

目次をよきタイミングでサイドバー固定追尾させる具体的な方法を教えていただけませんか?


 こちらのサイトのサイドバー追尾の目次を見て「いいなぁ〜」とおもいました。

 そこで、こちらで紹介されているサイトにある「HTMLとjavascript」コードをコピペして(cssはすこし変えました)みたのですが…

 スクロールダウンしてみると目次が追尾せずいったん画面から消えてしまい、さらにスクロールして下へ下へと行きますと再び現れるというように、一度目次が消えてしまいます。

 そうです、目次の表示されない高さがあるのです。

 

 「少しだけ解説」にあるように「javascript90行目付近の…」というところを調整してあげればいい塩梅になるのでしょうけれども、どうにもなにをどう変えたらよいのかわかりません。

 わたしにはどうもジャバ・ザ・ハットしません…

ハズブロ ジャバ・ザ・ハット

ハズブロ 2014 SDCC ブラック シリーズ ジャバ・ザ・ハット 【並行輸入品】

  • 出版社/メーカー: HASBRO
  • メディア: おもちゃ&ホビー
 

 …間違えました。

 ジャバがパッとしません。

 cssと違ってなんだかプログラムらしいプログラム(?)というのか、素人がイメージするコードらしいコードが並んでいて全然読めません。

 

 それで…どなたか…わたしはどうしたらサイドバーの目次をうまい具合に追尾させられるのか教えていただけませんかねぇ?

 よろしくお願いします。どなたか〜。

 

 

追記:2016年12月29日

 サイドバー固定追尾する目次の作者であるトワ(id:Twilyze)さんからコメントをいただき、この問題を解決できたっぽいです。

 

 コメント欄にあるように「.urlist-with-thumbnails」や「.hatena-urllist」のいくつかのマイナスmarginを変えてはみたものの状況は芳しくなく、なにも変わらなかったのですが…
 理屈はわかりませんし、またプログラム的に正しいのかもかわかりませんが…
 105行目の「// 最後のモジュール以外のサイドバー高さ合計」と書かれた次の行、106行目の「var sidebarHeight = 0;」の値「0」を「-900」にしたら、なぜかうまく固定(fixed)されるようになりました。

 

 「-900」という値をどこから出したかというと…地道に1つずつ数字を変えていってたどり着きました。

 値をいろいろ変えて試している中で、なぜか-830ではよくても-829ではダメなときがあったり、-830でもいいときとだめなときがあったりと、あたふたジャバジャバおぼれかけました。

 

 このほどトワ(id:Twilyze)さんが投稿された『サイドバーに現在位置を表示して追尾する目次を設置する【目次記法対応版】』において「JavaScript85行目から120行目の辺り」という以前よりも限定された指示と、スクリプトに行数がふられていて見やすくなったページを参照することでうまくいきました。

 

 この場を借りてお礼申し上げます。ありがとうございました。

 

 この方法が正しいとしたら、サイドバー追尾がうまく固定されずお嘆きの方は、一度106行目の値を変えてみてはいかがでしょうか?

 保障はできませんよ。これでいいのかどうか知識がないからわたしには判断できませんもの。