如何使用圖像複選框使用CSS或可能是Javascript？

這顯然很簡單的問題，但我從來沒有做過這樣的事情。我的設計師想要一些像this (it is on left side. Checked ones are grey and other white)這樣的複選框。任何幫助有關這將不勝感激。如何使用圖像複選框使用CSS或可能是Javascript？

2012-02-29 Imran

一個想法就是用跨度與背景圖像（空箱），隱藏相關的複選框，一個函數clickhandler分配給該跨度（onclick：更改相關隱藏複選框的檢查屬性，相應地更改跨度的背景圖像）。

這裏是一個

2012-02-29 09:42:06 KooiInc

看起來很有趣。 – Imran 2012-02-29 09:45:05

我會舉一個例子@jsfiddle，等一會兒... – KooiInc 2012-02-29 09:46:24

請參閱編輯答案 – KooiInc 2012-02-29 10:10:07

對於這種事情，我使用jQuery UI。一個例子是在這裏：http://jqueryui.com/demos/button/#checkbox

和一些示例代碼：

<script> 
$(function() { 
    $("#check").button(); 
    $("#format").buttonset(); 
}); 
</script>

2012-02-29 09:38:22 Undefined

，對於這個小片的視覺效果，你覺得我應該包括jQuery UI的核心和UI控件到我的javascripts？ – Imran 2012-02-29 09:43:46

我會的，jQuery UI也會照顧複選框的任何跨瀏覽器問題:) – Undefined 2012-02-29 09:52:27

2012-02-29 09:51:36 utsikko

這裏是一個jQuery腳本爲

我不是在我的網站使用「jQuery UI的」

2012-02-29 10:01:25 Starx

回答