How can I show images to select on a html form?

Question

I want to show something like select option, but with images in stead of text. Is that possible? I get the images src by php. Once you select a image I want to take his src to submit my form.

Please don't tag-spam. Ex: if you're looking a jQuery solution, then mention it your question (and show your code attempt)... don't just use the [tag:jquery] tag by itself. — Sparky, Mar 25 '14 at 15:29

C M · Accepted Answer · 2014-03-25T15:41:33.500

Hope this helps...

<select name="selectBox1">
  <option value="img1.png" style="background-image:url(img1.png);">male</option>
  <option value="img2.png" style="background-image:url(img2.png);">female</option>
  <option value="img2.png" style="background-image:url(img3.png);">others</option>
</select>

On submitting the form you will get the selected value inside $_POST["selectBox1"] post variable.

Thanks.

score 0 · Answer 2 · answered Mar 25 '14 at 15:27

0

You can use

background-image:url(url here)

answered Mar 25 '14 at 15:27

Amit Joki

56,285
7
72
91

1

thanks, but that solution only works on firefox. And i would like to show full image. – Mikelon85 Mar 25 '14 at 16:05

How can I show images to select on a html form?

2 Answers2