kpa
Posts: 31
|
| Posted: 03/20/2010, 11:42 PM |
|
I am creating an app where the user can select an icon for displaying a Google Map for their business. I seem to recall seeing an example somwhere in CCS of how you can display an image in a dropdown list - I've trawled everything I can find but can't seem to locate it now - can anyone point me in the right direction please. Thank you!!!
_________________
++++++
kpa
++++++ |
 |
 |
damian
Posts: 838
|
| Posted: 03/22/2010, 4:12 AM |
|
is it essential to use a drop down? i use radio buttons to do something similar...
_________________
if you found this post useful take the time to help someone else.... :)
|
|
|
|
andy
Posts: 183
|
| Posted: 03/22/2010, 1:52 PM |
|
I think you may have to resort to using a commercial script.
Here's an example:
http://dhtmlx.com/docs/products/dhtmlxCombo/index.shtml
See "Combobox with icons".
No experience of integrating this into CCS though...
_________________
Andy
RAD tools for rich UI controls:
http://www.koolphptools.com |
|
|
|
kpa
Posts: 31
|
| Posted: 03/23/2010, 4:58 AM |
|
Thanks guys - the idea of radio buttons hadn't occurred to me so thanks for the tip - I think I was thinking that there may be quite a few of them so a drop down list might be a bit more compact. And thanks for the tip on dhtmlx too - looks like there might be a solution there if I cna get it into CCS. However, I still can't help but think I saw this somewhere in CCS. I'll put it down to cosmic rays!
_________________
++++++
kpa
++++++ |
|
|
|
melvyn
Posts: 333
|
| Posted: 03/23/2010, 5:07 AM |
|
Quite easy!
<select id="myselect">
<option value="1" style="background:url(image1.jpg)">option 1</option>
<option value="2" style="background:url(image2.jpg)">option 2</option>
<option value="3" style="background:url(image3.jpg)">option 3</option>
</select>
That's the fast way, which I don't recommend. You need some .css knowledge to achieve better results, as following:
<select id="myselect">
<option value="1" id="sel-opt1">option 1</option>
<option value="2" id="sel-opt2">option 2</option>
<option value="3" id="sel-opt3"option 3</option>
</select>
Now, on style sheet:
#myselect option{
padding-left:20px;
}
#sel-opt1{
background:url(image1.jpg) no-repeat;
}
#sel-opt2{
background:url(image2.jpg) no-repeat;
}
#sel-opt3{
background:url(image3.jpg) no-repeat;
}
You'll need something like that (with padding or margin) because the margin, without it, all text will appear over the imagen and bah yadah, yadah.., etc...
Test it and tell us...
_________________
Melvyn Perez
Puro Codigo
http://purocodigo.com |
|
|
|
kpa
Posts: 31
|
| Posted: 03/23/2010, 5:44 AM |
|
Thanks heaps for the code tips. I knew I'd seen it somewhere in CCS but it wasn't a SELECT as I thought - it was an auto complete - http://examples.codecharge.com/Ajax/Autocomplete.php
_________________
++++++
kpa
++++++ |
|
|
|
Oper
Posts: 1195
|
| Posted: 03/23/2010, 7:14 AM |
|
you always could use Service, Ajax, etc
another easy way is create a image clikc, as soon you click that image a popup (normal or DHTML)
show up display or image you need, click the image you want on that popup and then will be added as you image selected.
but you could use melvin <select> sample but crete dynamicly
_________________
____________________________
http://www.7bz.com (Free CMS,CRM Developed in CCS)
http://www.PremiumWebTemplate.com
Affiliation Web Site Templates
Please do backup first |
|
|
|
