@kyanny's blog

My thoughts, my life. Views/opinions are my own.

映画のネタバレ感想文を書きやすくする

気兼ねなくネタバレを含む感想文を書きたいと常々思っていたので、作ってみた。

「ネタバレを読む」ボタン。押すとネタバレ感想文が読める。 CSS で隠すだけでは RSS/Atom フィードで全文配信したとき読めてしまうので、ボタンを押したら JavaScript で動的に書き出す仕組みにした。そのボタン一式のコードスニペットを組み立てるアプリケーションを作った。 CodePen で React の練習がてら作った。

See the Pen Create "Show Spoiler" Button by Kensuke Nagae (@kyanny) on CodePen.

Create "Show Spoiler" Button

JavaScript 関数ごとベタ書きしてしまうので、貼り付けたボタンの振る舞いをあとでまとめて変えたりすることが難しいけど、まぁ十分目的は果たした。


CSS で隠すタイプだと、はてなダイアリーの頃の d:id:matakimika は薄緑色の背景色の上に濃いめの緑色でネタバレ部分だけを塗りつぶすスタイルでやっていて、あれがとても好きだったのだけど、フィードリーダー対策というかむしろフィードリーダーで読んでくれてる人に対してネタバレしないように配慮するために JavaScript でやるのは外せなかった。

matakimika.hatenadiary.jp

これとか、どうやってたんだろと思ったらやはり至極簡単なマークアップでやっていたようだ。

f:id:a666666:20200420030526p:plain