2015-11-19 61 views
3

一個選擇圖像我需要的圖像selectables形式,從來就serched在谷歌和我嘗試選擇選項,但這不是工作如何使形式

你能不能給任何想法來解決這個好嗎?

我使用波旁&整齊(SASS)

enter image description here

回答

3

我會讓複選框成圖像,看到小提琴https://jsfiddle.net/0c26tqd7/1/

編輯我加了紅色邊框上選中複選框小提琴

html

<input type="checkbox" name='thing1' id="thing1"/><label for="thing1"></label> 

CSS

input[type=checkbox] { 
    display:none; 
} 

input#thing1[type=checkbox] + label 
{ 
    background-image: url("http://lorempixel.com/50/50/"); 
    height: 50px; 
    width: 50px; 
    display:inline-block; 
    padding: 0 0 0 0px; 
} 
+1

+1大答案。另外,'$('#thing1').css('background-image','url(image.ext)');'可以幫助你動態地設置圖像 –

+1

另外,還有一點需要注意:如果OP想要一次一個選擇,改變爲具有相同'名稱'的單選按鈕 –