作者robenten (:)
看板Web_Design
標題[問題] div中放置數個div
時間Fri Dec 27 23:59:22 2013
各位版友好, 小弟想製作題目勾選的效果, 於是在外框<div>中置入圖片<img>與數個
代替按鈕的<div>, 不知道為什麼按鈕位置只有在CSS中div div{}下設定才行, 在ID下設定
都沒有作用, 而且僅出現一個按鈕(html的div中有兩個div), 請問有高手知道原因嗎?
請參考原始碼:
http://jsfiddle.net/robenten/u4F2r/5/ 謝謝各位~
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 36.224.52.38
※ 編輯: robenten 來自: 36.224.52.38 (12/28 00:05)
1F：推 gary22204:兩個按鈕都有出來，只是因為絕對位置的關係被放在同一個 12/28 00:50
2F：→ gary22204:位置，我也不知道為什麼＃1st不能那樣寫，我也是新手... 12/28 00:51
3F：推 iceblue7x:違反id命名規則 12/28 02:35
4F：→ robenten:嗯嗯 應該是id命名開頭不能使用數字 謝謝樓上兩位 12/28 13:38
6F：→ robenten:不過使用first-child跟nth-child就不行了 12/28 13:50
8F：→ robenten:有人知道原因嗎? 12/28 13:50
10F：→ robenten:first-child是一個selector可以在CSS使用 請參考 12/28 22:17
12F：→ robenten:現在加上點選後可以改變按鈕顏色的功能, 不過在點選後 12/28 22:23
13F：→ robenten:取消mouseenter & mouseleave的顏色淡出效果 12/28 22:24
15F：→ robenten:有人知道要如何辦到嗎? 困擾一整天了.... 12/28 22:25
16F：推 s540421:有highlighted class的div就不觸發event 12/29 10:32
17F：→ s540421:$('div div:not(.highlighted)').mouseenter(...) 12/29 10:33
18F：→ s540421:而題目太多時會有效能問題，可以改將事件綁定到parent上 12/29 10:34
19F：→ s540421:假定題目div給他一個叫做 quiz 的 classname 12/29 10:35
20F：→ s540421:$('div.quiz').on('mouseenter', 'div:not(highlighted)', 12/29 10:36
21F：→ s540421: ...); 12/29 10:36
23F：→ s540421:再做了點修改，讓fadeTo動畫能即時反應事件 12/29 11:00
25F：→ robenten:謝謝 s大 不過我把我的code加上not的條件後還是不行 12/29 23:55
27F：→ robenten:恩 剛剛研究一下似乎一定要使用on() 因為ready()時 12/30 00:17
28F：→ robenten:所有的class都已經紀錄 所以toggleClass沒有作用 12/30 00:18
29F：→ robenten:謝謝提醒 :) 12/30 00:18