【Cocoon】サイドバーの目次に現在位置を表示する【コピペOK】

jQuery(function() {
// ナビゲーションのリンクを指定
var navLink = jQuery('#sidebar-scroll li a');
if(!navLink[0]) {
return false;
};
// 見出しを配列に格納
var contentsArr = new Array();
for (var i = 0; i < navLink.length; i++) {
// 見出しを取得
var targetContents = jQuery(navLink.eq(i).attr('href'));
// 配列に格納
contentsArr[i] = targetContents
};
//投稿記事エリアの次の要素を最終位置取得用に追加
contentsArr[i] = jQuery('.article-footer');
// 現在地をチェックする
function currentCheck() {
navLink.removeClass('current');
// 現在のスクロール位置を取得
var windowScrolltop = jQuery(window).scrollTop() + 50;
for (var i = 0; i < contentsArr.length-1; i++) {
// 現在のスクロール位置が、見出しと次の見出しの間にあるものを調べる
if(contentsArr[i].offset().top <= windowScrolltop && contentsArr[i+1].offset().top > windowScrolltop) {
//ナビゲーションにclass="current"をつける
navLink.eq(i).addClass('current');
//目次のカレントが表示領域から出たら見える位置までスクロール
var tocList = jQuery('.toc-content>ol');
var posTop = navLink.eq(i).position().top;
if (tocList.innerHeight() < posTop + 60) {
tocList.scrollTop(tocList.scrollTop()- tocList.innerHeight() + posTop + 60);
}
if (posTop < 60) {
tocList.scrollTop(tocList.scrollTop() - 60);
}
break;
}
};
}
// ページ読み込み時とスクロール時に、現在地をチェックする
jQuery(window).on('load scroll', function() {
currentCheck();
});
// ページ読み込み時とリサイズ時に目次のMaxHeightを設定
var timer = false;
$(window).on("load resize", function() {
if (timer !== false) {
clearTimeout(timer);
}
timer = setTimeout(function() {
jQuery('.toc-content>ol').css('max-height', jQuery(window).height() - 100);
}, 100);
});
});

.toc li .current {/*現在位置*/
color: #333;/*文字色*/
padding: 6px 6px 6px;
background-color: #f5f5f5;/*背景色*/
}