ネタバレ記述対策委員会。

雑記 備忘録

そして今、いわゆる「ネタバレ部分」をうまく隠す方法について調べていて、ガチーンと僕の好みに合うページは見つからなかったのですが、いくつか組み合わせたら好みにヌボッとはまったものが出来上がったので嬉しくて上で使ってみました。
なにってこれこれ。こういう隠し方！

で、一人でこの知識を抱えてヌフヌフしててもいいのだけど、せっかくなので皆様にご披露。
まず参考にしたのは
http://d.hatena.ne.jp/mozuyama/20040425/p2
のエントリーです。でもこの方法だと、背景色を変えるたびに設定しなおさなければならないし、たとえばこのデザインみたいに本文と引用部の背景がそれぞれ違ったりすると、どちらのテーブルのなかにあっても隠すということが困難な感じ。たぶん、これは「ここに文字が隠してありますよ！」と読者にアピールしない、ガチで隠す（つってもドラッグさせれば見えるんだけど）場合の使い方なのかなあ、という感じがします。でもリンクとかキーワードも隠せるってのはすごくポイント高いです。おしえてくれてありがとう！
そしてもう一つ参考にしたのが
http://d.hatena.ne.jp/s_sawada/20030207#p3
のエントリー。こちらは逆に、本文文字色にあわせて背景色を変えようというアプローチ。でも今度は文字色を変えるとまた設定しなおさなければならないんですね。や、外部ＣＳＳだから修正するのラクだけども。でもこれはすごくいいですね。おしえてくれてありがとう！

っちゅわけでふたっつ混ぜてみました。
同じ「himichu」属性に背景色と文字色を設定。こうすると上記のような存在は主張しつつも内容は隠された部分が出来上がる次第であります。
その場合のスタイルシートの例を以下にあげておきます。どなたかのお役に立てれば幸い。

span.himichu {
 color: #ededed;
}
span.himichu {
   background-color: #ededed;
}

span.himichu a.keyword {
 color: #ededed;
 text-decoration:none;
 border-bottom: 1px dotted white;
}

span.himichu a.keyword:visited {
 color: #ededed;
 text-decoration:none;
 border-bottom: 1px dotted white;
}

ちなみに、これをＣＳＳにはっつけておいて

<span class="himichu">いやん、ここに文章を書くの！</span>

と記述すれば多分大丈夫、の、はず。うん。たぶん。
ちなみに、この形式の功罪とかについては
http://d.hatena.ne.jp/matakimika/20040209#p5
こちらがものすごく判りやすくまとめられております。