はてなブログの目次をちょっとだけカスタマイズ2018-03-08はてなブログの目次をちょっとだけカスタマイズブログ本日は、はてなブログのデザインについてちょっとカスタマイズを実施したので、その方法をご紹介したいと思います。今回実施したことはじめ非表示で、「目次」をクリックすると表示するクリックするとスムーススクロールする実施してみて今回実施したこと実施したのは以下の2つとなります。はじめ非表示で、「目次」をクリックすると表示するクリックするとスムーススクロールするはじめ非表示で、「目次」をクリックすると表示するコーディングするのは、CSSとjavascriptになります。はじめにCSSのコーディングです。設定はデザインCSSに行います。内容は以下の2つとなります。blue;}次にjavascriptを記載します。記載するところはフッターが良いですね。内容は以下の2つでとってもシンプルです。目次(Classがtable-of-contents)の要素の前に表示/非表示をトグルさせるための要素を追加する追加したトグルをクリックしたときの動作(トグルも[表示]と[隠す]を切り替える)実際のコードは以下となります。});});</script>クリックするとスムーススクロールするこちらはjavascriptのみとなります。jQueryで記載をします。始まることを利用してクリックしたときに遷移先までスクロールのアニメーションするように処理を入れています。ポイントは遷移先の場所。-30を入れることでリンク先がブラウザのトップから少ししたに下がるので見やすくなります。});});</script>実施してみてこのブログにも設定していますので、実際に動かしてみてください。したことだけど、サイトを見に来てくれている人に喜んでもらえれば何よりです。マウスのスクロールを一緒にしようMacとWindowsを両方使っていて一番不便なのはマウスのスクロー...2018-07-13はてなブログにリンクユニット広告を掲載してみる(目次のアニメーションとの共存版)今回ブログのデザインを少し変えてみました。禁煙と売上の関係とは?エビデンスをしっかりと確認することの大切さ外食大好き管理人です。公式テーマを変更するのに思いの外ハマってしまったちょっと前に目次をちょっとだけカスタマイズしました。しているMVNOはこちらです月別アーカイブスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。