Webページにドラッグでページスクロール可能なミニマップを生成するスクリプト・「pagemap」 - かちびと.net

pagemapはWebページにドラッグでページスクロール可能なミニマップを生成するスクリプトです。非依存型 単体で動作します。 上デモ右端にあるやつです。Atomなど、テキストエディタにもよくあるミニマップをWebぺージで自動生成してくれます。 ミニマップはマウスドラッグでページ内をスクロール可能で、ぱっと見でもどんなコンテンツがあるかもある程度分かるようになっています。 <canvas id='map'></canvas> canvasを用意します #map { position: fixed; top: 0; right: 0; width: 200px; height: 100%; z-index: 100; } 生成されるマップを固定します <script src="pagemap.js"></script> <script> pagemap(document.querySelec

[nelog]

“スクリプトを読み込んで生成先に先ほど用意したcanvas”