このブログをマテリアルデザインっぽくリニューアルしたときに実装した機能をご紹介するコーナーがやって来ました。 第一弾はレスポンシブデザインにおけるテーブルの可変パターンでしたが、今回ご紹介するのは、jQueryによる目次の自動生成です。 WordPressで目次生成といえば「Table of Contents Plus」という有名なプラグインがありますが、今回は今見ている項目の見出しをハイライトさせたかったので今回は自前で実装してみました。 jQueryで実装すればサーバーに負担も掛けないし、はてなブログなどでも利用できるので汎用性が高いと思います。 デモ・ダウンロード とりあえずサンプルを見て下さい。当ブログのデザインを簡素化したもので、横幅768pxより大きければサイドバー部分に目次が追従してきます。タブレットやスマートフォンではあえて非表示にしています。 スムーズスクロールのエフェク
![【jQuery】記事の見出しを自動取得して目次を作ってみよう!](https://cdn-ak-scissors.b.st-hatena.com/image/square/780171abba1f34868cab4df31d45bb43e3f5f6a5/height=288;version=1;width=512/https%3A%2F%2Fcreatorclip.info%2Fwp-content%2Fuploads%2F2015%2F10%2Ftableofcontents.gif)