選択反転テスト

検証用のページです（本番には含めません）。各テストの文章を長押しして、選択範囲を左右に広げてください。

テスト1　白い文字（文の途中）

見えている文ごと選択すると、文の途中に白い文字が現れるか。すき間が不自然に見えないか。

今日はドレスの試着にし行ってきました。3着着てみて、ろどれも素敵で迷います。

帰りにカフェでWひと休みしました。

テスト2　白い文字（段落の外）

段落の終わりや、空いている行に置いた白い文字を選択できるか。

前撮りの日程が決まりました。当日、晴れるといいな。い

も

衣装は和装にする予定です。

テスト3　白い文字（イラストの上）

イラストの白い部分に重ねた文字を選択できるか。画像を長押ししたとき、画像の保存メニューが邪魔をしないか。

試着したドレスのイラストです。

じ

テスト4　練習用（青丸）

青い丸を選択すると、白以外の色で文字が現れるか。

青い丸を反転すると… せいかい …が現れます。

テスト5　オレンジの文字

オレンジ色として読めるか。普通の文字と区別できるか。

今日はテーブルの飾りを決めました。スタッフさんと相談して、トルコキキョウを使うことに。

テスト6　まとめ（記事風）

段落をまるごと選択したとき、白い文字・練習用・オレンジが見分けられるか。練習用の文字が「白い文字」に見えないか。

2人で披露宴の曲を選びました。入場の曲はすぐ決まったけれど、ゆ退場の曲でき悩みました。最後は、昔よく一緒に聴いた曲に。ね

確認すること

1. 方式「両方」で、白い文字が白のまま濃い背景の上に読めるか（テスト1〜3）
2. 練習用の文字が、白ではない色で現れるか（テスト4・6）
3. 見えない文字に、周りの文字から選択を広げてたどり着けるか
4. 選択を解除すると、元どおり見えなくなるか
5. スマホをダークモードにしても、白い文字が最初から見えてしまわないか
6. LINEのQR読み取りで開いたとき（LINE内ブラウザ）も同じように動くか
7. 反転したときの背景色・練習用の色は、どの組み合わせが見やすいか

iPhoneで方式を「CSSのみ」にすると、白い文字が読めない（または薄い）はずです。その差で、JSの補助が効いていることを確認できます。