カテゴリ:カスタマイズ プラグイン改造

目次の表示・非表示機能の追加

Javascriptを使って目次に表示・非表示機能を追加する。
デフォルトで非表示状態にしてある。
今の所各ページに一個しか設置しないため、複数個置いたときの事は考えていない。
複数個置く場合はグローバル変数でカウントしてid振るか、もしくは2個以上設置したらエラー吐けばいいのかな?

@@ -72,12 +72,28 @@
             if ($html != '') {
             $html = '<table border="0" class="toc"><tbody>' . "\n"
                 . '<tr><td class="toctitle">' . "\n"
-                . '<span>' . _('Table of Contents') . "</span>\n"
+                . '<span>' . _('目次') . '</span><span class="toctoggle">[<a href="#" id="togglelink">表示</a>]</span>' . "\n"
                 . "</td></tr>\n"
                 . '<tr><td class="toclist">' . "\n"
                 . $html 
                 . "</td></tr>\n"
                 . "</tbody></table>\n";
+            $html .= <<<EOD
+            <script type="text/javascript">
+ $('a[href="#"]').click(function(){
+   return false;
+ });
+ $('#togglelink').on('click', function () {
+  if ($(this).text() === '表示') {
+    $(this).text('非表示');
+    $(".toclist").show();
+  } else {
+    $(this).text('表示');
+    $(".toclist").hide();
+  }
+});
+</script>
+EOD;
             }
             return $html;
         } while (false);


最新の10件を表示しています。 コメントページを参照

  • プラグインについていつも参考にさせて頂いております。今回記事にある様に試そうとしたのですが、contentsx.inc.phpがPHP8に対応した物(byはいふんさん)しか見つけることができず、ソースが改修されており改造が出来ませんでした・・・。お手すきの時がありましたら、最新のv1.13での情報更新をお願いいたします -- 2024-08-26 (月) 20:00:56
    • 私が使用しているのはsonots氏のgithubで公開されているバージョンをPHP8に対応させたうえで自サイト用に改造しているものです。
      私自身はいふん氏がPHP8に対応させたバージョンがどの様になっているかは知らないので、申し訳ないですが参考になりそうな情報は書けないかと思います。
      このページ自体も当時備忘録として簡単に書いたもので、現在ではjQueryを使っておらず、HTML構造も変えてしまっているため、内容と実際のソースは大きく乖離しています。現在の構造が気になるようであれば開発者ツールなどで確認してみてください。
      参考になるかは分かりませんが、一応ページの内容を更新しておこうかとは思います。 -- kanateko 2024-08-27 (火) 00:54:27