WordPressの講義録を見せながらの授業だけど、考えてもらいたい時に答えも含めすべて記載してあると、悩んでもらえない。この対応として以前は、JavaScript を使って非表示/表示をさせていたけど、WordPressのビジュアルエディタが、タグの onclick=”javascript処理” を消してくれるため、編集に注意が必要だった。
CSSだけで表示を隠したいので、mouse over(:hover) を使うようにしてみた。
/* 隠したい所は、<div class="hidden-hover">隠すテキスト</div> */
.hidden-hover {
color: #EEE;
background-color: #EEE;
}
.hidden-hover:hover {
color: #000;
background-color: #AFA;
}
/* 隠したい所は、<div class="hidden-hover">隠すテキスト</div> */
.hidden-hover {
color: #EEE;
background-color: #EEE;
}
.hidden-hover:hover {
color: #000;
background-color: #AFA;
}
/* 隠したい所は、<div class="hidden-hover">隠すテキスト</div> */
.hidden-hover {
color: #EEE;
background-color: #EEE;
}
.hidden-hover:hover {
color: #000;
background-color: #AFA;
}
授業で理解度の確認で、この問題解いて…の結果を Forms でリアルタイムに返答させたけど、解かせて回答させるとなると、答え見ちゃうよなぁ….。この程度の隠し方では、正解しか帰ってこない。見せ方をもっと変えないとダメだな。
授業前に、hover で隠している部分を コメントアウトして、授業後に戻すぐらいしないとダメだな。