こちらのページの右上のもの
とりあえず、関係する JS を読み込む。jQuery の plugin として作っているので jQuery も必要。
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="http://shunshun94.web.fc2.com/lib/breadcrumb-list.js"></script>
そのうえで、今どこを読んでいるのかの基準にしたい要素群 (多分 h2 要素や h3 要素になる) に対して bindBreadcrumbList() 関数を実行する。
$("h2").bindBreadcrumbList();
ページを閲覧している人が画面をスクロールしていき、この関数を実行された要素を過ぎた際、各要素が BreadcrumbListEvent を発火させるようになる。それを listen すればよい。
$("h2").on("BreadcrumbListEvent", function(e){
console.log($(e.target).text());
});
console.log になっている部分を画面上部に配置された今どこを見ているのかを示す案内の text を変えるとかそんなコードに書き換えれば使えるはず。
ただいまコメントを受けつけておりません。