Tumblrのカスタムページで、YouTubeの概要欄みたいにクリックで連絡先を表示するものを実装したくて、いろいろやって失敗したものです。
（Tumblrのカスタムページが何かっていう説明は省きます）
JSで書こうとした
See the Pen ButtonToggle JS by ぽんたん (@pontan113) on CodePen.
最初にやりたかったのがこれで、これが使えたらいいな～と思ってたんですけど、scriptタグが使えないぽくてJS無理でした
使うにはTumblr公式へ連絡が必要みたいです
まあ危険だもんね、仕方ないね
CSSで書こうとした（input）
See the Pen ButtonToggle CSS label by ぽんたん (@pontan113) on CodePen.
JS使わずinputの同期はできなかったので△は消してますが、まあ同じ動きするし、これでいっか！と思って保存したら、inputタグが消え去ってて狂いました
CSSで書こうとした2（hover）
もうしょうがないので、妥協に妥協を重ねてhoverのみの実装にしました
See the Pen ButtonToggle CSS hover by ぽんたん (@pontan113) on CodePen.
details
ここまで書いてあれですがdetailsの存在に今気付きました
本当によわよわです
ですけどdetailも消されるみたいで、ダメでした
See the Pen ButtonToggle CSS details by ぽんたん (@pontan113) on CodePen.
他に良いアイデアがあると思います
Tumblrのカスタムページでは使用できないタグがあるのは知ってましたが、本当に何も使えないんだな…と思いました
「このタグ、保存した後消されるな…」と思ったらだいたいダメなので、諦めましょう
おわり