トップ/pukiwiki1.5/spoiler.inc.php
#author("2025-04-28T13:38:03+09:00","default:nemusg.pad","nemusg.pad") #author("2025-08-24T23:58:03+09:00;2025-04-28T13:38:03+09:00","default:nemusg.pad","nemusg.pad") #title(spoiler(ネタバレ防止)) [[Discordにはspoilerというネタバレ防止用タグがあります:https://support.discord.com/hc/ja/articles/360022320632]] が、それと同じことをブログなどでCSSで実現する方法が下記です。 ** デモ [#f3a4ac41] マウスホバーや、スマホのタップで塗りつぶしが解除されます。 &spoiler(ネタバレになることをここに書きます); HTML <span class="spoiler" ontouchstart>ネタバレになることをここに書きます</span> CSS #code_x{{ .spoiler { padding: 0 4px; color: #333; background: #333; border-radius: 4px; } .spoiler:hover, .spoiler:active { color: #d3ddde; background: #4a4d53; } }} これをPukiwikiでも利用できるようにしました。 ** 使い方 [#xe2b4b92] &spoiler(ネタバレになることをここに書きます); ** spoiler.inc.php [#ve555b43] #code_x{{ <?php /** * spoiler.inc.php - インラインでネタバレ表現するプラグイン * &spoiler(ここに内容); */ // PukiWiki定数がない場合は直接アクセスを拒否 if (!defined('PKWK_READONLY')) { die('このファイルには直接アクセスできません。'); } // インラインプラグイン本体 function plugin_spoiler_inline() { // 引数を取得 $args = func_get_args(); if (count($args) === 0) return ''; // 第一引数をテキストとして使用 $text = array_shift($args); // 出力 return '<span class="spoiler" ontouchstart>' . htmlspecialchars($text) . '</span>'; } }} #include(parts/feedback,notitle)