2
這是我的代碼:奇怪的CSS選擇器組合
HTML
<div id="corner">
<div id="cornerbox"></div>
</div>
CSS
#corner {
background-color: red;
width: 200px; height: 200px;
}
#corner #cornerbox {
background-color:black;
width: 100px; height: 100px;
opacity: 0.4;
}
#corner:hover #cornerbox, #corner #cornerbox.show{
opacity: 1;
}
JavaScript
$(document).keypress(function(e) {
//console.log("keypress event from document: ",e.which);
if (e.which == 63) { // question mark (?) key
$("#cornerbox").toggleClass("show");
}
});
因此,只要按下問號(?)鍵,每當#corner:懸停時,JavaScript都會使「#cornerbox」更改不透明度,並且JavaScript會切換類「showcornerbox」的「#cornerbox」。
我注意到,如果我改變上述CSS看起來像這樣:
#corner {
...
}
#corner #cornerbox {
...
}
#corner:hover #cornerbox, #cornerbox.show {
...
}
透明度不改變,當按鍵被按下,但「#cornerbox」接收級「秀」(?) 。
所有其他的可能性工作。
This Works。
#corner {
...
}
#cornerbox {
...
}
#corner:hover #cornerbox, #corner #cornerbox.show {
...
}
這個工程。
#corner {
...
}
#cornerbox {
...
}
#corner:hover #cornerbox, #cornerbox.show {
...
}
爲什麼?
預先感謝您!
田瀨
哇,你快!謝謝! :)我需要閱讀更多! – Tase 2013-02-18 14:40:51