| HTML select field where the OPTION text is of different colors [message #172758] |
Mon, 28 February 2011 06:52  |
venky_lb
Messages: 4
Registered: November 2010
Karma: 0
|
Junior Member |
|
|
Hi
Is it possible to have an HTML select field where the OPTION text is
of different colors?
<select>
<option>Black_text (yellow_text)</option>
</select>
I tried using an CSS SPAN element to color the text but that doesn't
seem to work.
Any ideas?
|
|
|
|
| Re: HTML select field where the OPTION text is of different colors [message #172760 is a reply to message #172758] |
Mon, 28 February 2011 08:50  |
Andy
Messages: 8
Registered: March 2002
Karma: 0
|
Junior Member |
|
|
"venky_lb" <lb(dot)venky(at)gmail(dot)com> wrote in message
news:126b4778-ace0-4a04-8a8c-0d2ec2793234(at)k10g2000prh(dot)googlegroups(dot)com...
> Hi
>
> Is it possible to have an HTML select field where the OPTION text is
> of different colors?
>
> <select>
> <option>Black_text (yellow_text)</option>
> </select>
>
> I tried using an CSS SPAN element to color the text but that doesn't
> seem to work.
>
> Any ideas?
>
<select>
<option>one</option>
<option style="color: #ff6666; background: #336633">two</option>
<option>three</option>
</select>
Hope this helps
Andy
|
|
|
|
| Re: HTML select field where the OPTION text is of different colors [message #172767 is a reply to message #172758] |
Mon, 28 February 2011 13:31 |
gemoroy(at)gmail(dot)com
Messages: 1
Registered: February 2011
Karma: 0
|
Junior Member |
|
|
On Feb 28, 9:52 am, venky_lb <lb.ve...@gmail.com> wrote:
> Hi
>
> Is it possible to have an HTML select field where the OPTION text is
> of different colors?
>
> <select>
> <option>Black_text (yellow_text)</option>
> </select>
>
> I tried using an CSS SPAN element to color the text but that doesn't
> seem to work.
>
> Any ideas?
It's impossible. The only one thing that you can try is to emulate
select/options by javascript, but it's not easy
|
|
|
|
| Re: HTML select field where the OPTION text is of different colors [message #172768 is a reply to message #172758] |
Mon, 28 February 2011 13:36 |
Erwin Moller
Messages: 228
Registered: September 2010
Karma: 0
|
Senior Member |
|
|
On 2/28/2011 7:52 AM, venky_lb wrote:
> Hi
>
> Is it possible to have an HTML select field where the OPTION text is
> of different colors?
>
> <select>
> <option>Black_text (yellow_text)</option>
> </select>
>
> I tried using an CSS SPAN element to color the text but that doesn't
> seem to work.
>
> Any ideas?
Hi Venky,
This is a PHP newsgroup.
You might get luckier here: alt.html
Regards,
Erwin Moller
--
"That which can be asserted without evidence, can be dismissed without
evidence."
-- Christopher Hitchens
|
|
|
|
| Re: HTML select field where the OPTION text is of different colors [message #172769 is a reply to message #172767] |
Mon, 28 February 2011 13:38 |
venky_lb
Messages: 4
Registered: November 2010
Karma: 0
|
Junior Member |
|
|
On Feb 28, 6:31 pm, "gemo...@gmail.com" <gemo...@gmail.com> wrote:
> On Feb 28, 9:52 am, venky_lb <lb.ve...@gmail.com> wrote:
>
>> Hi
>
>> Is it possible to have an HTML select field where the OPTION text is
>> of different colors?
>
>> <select>
>> <option>Black_text (yellow_text)</option>
>> </select>
>
>> I tried using an CSS SPAN element to color the text but that doesn't
>> seem to work.
>
>> Any ideas?
>
> It's impossible. The only one thing that you can try is to emulate
> select/options by javascript, but it's not easy
Hi,
Thanks for Sharing Ideas!!!
any references for select/options by javascript?
Cheers
|
|
|
|
| Re: HTML select field where the OPTION text is of different colors [message #172771 is a reply to message #172769] |
Mon, 28 February 2011 16:44 |
Jerry Stuckle
Messages: 2598
Registered: September 2010
Karma: 0
|
Senior Member |
|
|
On 2/28/2011 8:38 AM, venky_lb wrote:
> On Feb 28, 6:31 pm, "gemo...@gmail.com"<gemo...@gmail.com> wrote:
>> On Feb 28, 9:52 am, venky_lb<lb.ve...@gmail.com> wrote:
>>
>>> Hi
>>
>>> Is it possible to have an HTML select field where the OPTION text is
>>> of different colors?
>>
>>> <select>
>>> <option>Black_text (yellow_text)</option>
>>> </select>
>>
>>> I tried using an CSS SPAN element to color the text but that doesn't
>>> seem to work.
>>
>>> Any ideas?
>>
>> It's impossible. The only one thing that you can try is to emulate
>> select/options by javascript, but it's not easy
>
> Hi,
> Thanks for Sharing Ideas!!!
> any references for select/options by javascript?
>
> Cheers
Try a javascript newsgroup - and ask html/css questions in an
appropriate newsgroup.
--
==================
Remove the "x" from my email address
Jerry Stuckle
JDS Computer Training Corp.
jstucklex(at)attglobal(dot)net
==================
|
|
|
|
| Re: HTML select field where the OPTION text is of different colors [message #172773 is a reply to message #172767] |
Mon, 28 February 2011 16:47 |
The Natural Philosoph
Messages: 993
Registered: September 2010
Karma: 0
|
Senior Member |
|
|
gemoroy(at)gmail(dot)com wrote:
> On Feb 28, 9:52 am, venky_lb <lb.ve...@gmail.com> wrote:
>> Hi
>>
>> Is it possible to have an HTML select field where the OPTION text is
>> of different colors?
>>
>> <select>
>> <option>Black_text (yellow_text)</option>
>> </select>
>>
>> I tried using an CSS SPAN element to color the text but that doesn't
>> seem to work.
>>
>> Any ideas?
>
> It's impossible. The only one thing that you can try is to emulate
> select/options by javascript, but it's not easy
+1.
Option boxes are generally OS dependent, and very browser specific.
You don't need a LOT of javascript to generate a flyout menu with
colours, but you do need SOME.
Whether its an acceptable compromise, is up to the exact situation.
|
|
|
|
| Re: HTML select field where the OPTION text is of different colors [message #172774 is a reply to message #172769] |
Mon, 28 February 2011 16:57 |
The Natural Philosoph
Messages: 993
Registered: September 2010
Karma: 0
|
Senior Member |
|
|
venky_lb wrote:
> On Feb 28, 6:31 pm, "gemo...@gmail.com" <gemo...@gmail.com> wrote:
>> On Feb 28, 9:52 am, venky_lb <lb.ve...@gmail.com> wrote:
>>
>>> Hi
>>> Is it possible to have an HTML select field where the OPTION text is
>>> of different colors?
>>> <select>
>>> <option>Black_text (yellow_text)</option>
>>> </select>
>>> I tried using an CSS SPAN element to color the text but that doesn't
>>> seem to work.
>>> Any ideas?
>> It's impossible. The only one thing that you can try is to emulate
>> select/options by javascript, but it's not easy
>
> Hi,
> Thanks for Sharing Ideas!!!
> any references for select/options by javascript?
>
Write your ownn. You need to construct tables or a set of divs with
onclick() or onmouseover() events that actually cause the flyout, and
allow you to set a form variable depending on what has been onclicked()
ed. Then you can mark them hidden until the user clicks on a dummy
select box, and re-hide them if he clicks on a transparent layer that
covers the whole screen that lies 'underneath' them.
Its nasty because Old IE doesn't handle layers too well.
And also because old IE is a bitch to search at any speed, to identify
which elements you need to turn on and off.
(solved here by making a dynamically extended Javascript array of all
elements that are switched on, as they are switched on, and searching
just that).
My code is a bit too application specific to be useful here.
And belongs in a javascript group anyway.
> Cheers
|
|
|
|
| Re: HTML select field where the OPTION text is of different colors [message #172777 is a reply to message #172767] |
Mon, 28 February 2011 23:33 |
Captain Paralytic
Messages: 204
Registered: September 2010
Karma: 0
|
Senior Member |
|
|
On Feb 28, 1:31 pm, "gemo...@gmail.com" <gemo...@gmail.com> wrote:
> On Feb 28, 9:52 am, venky_lb <lb.ve...@gmail.com> wrote:
>
>> Hi
>
>> Is it possible to have an HTML select field where the OPTION text is
>> of different colors?
>
>> <select>
>> <option>Black_text (yellow_text)</option>
>> </select>
>
>> I tried using an CSS SPAN element to color the text but that doesn't
>> seem to work.
>
>> Any ideas?
>
> It's impossible. The only one thing that you can try is to emulate
> select/options by javascript, but it's not easy
It's impossible is it. I wish you'd told me that before I actually did
it last year for a client of mine. Now I guess I'll have to tell them
that they can't use it any more because it is now impossible!
Although this has nothing to do with php, for anyone interested in
performing the impossible, here is an example of doing it with
different background colours. I will leave it as an exercise for the
reader to change it to use text colours (apart from those that find it
impossible).
<select onchange="this.style.backgroundColor='#'+this.value;"
style="background-color: rgb(255, 0, 0);" name="fd_colour" size="1">
<option style="background-color: rgb(255, 255, 255);"
value="ffffff">Colour</option>
<option selected="" style="background-color: rgb(255, 0, 0);"
value="ff0000"> </option>
<option style="background-color: rgb(255, 153, 0);"
value="ff9900"> </option>
<option style="background-color: rgb(255, 255, 0);"
value="ffff00"> </option>
<option style="background-color: rgb(0, 255, 0);"
value="00ff00"> </option>
<option style="background-color: rgb(0, 255, 255);"
value="00ffff"> </option>
<option style="background-color: rgb(159, 197, 232);"
value="9fc5e8"> </option>
<option style="background-color: rgb(215, 172, 255);"
value="d7acff"> </option>
<option style="background-color: rgb(255, 0, 255);"
value="ff00ff"> </option>
<option style="background-color: rgb(255, 204, 153);"
value="ffcc99"> </option>
<option style="background-color: rgb(255, 153, 204);"
value="ff99cc"> </option>
<option style="background-color: rgb(204, 255, 204);"
value="ccffcc"> </option>
<option style="background-color: rgb(255, 255, 153);"
value="ffff99"> </option>
</select>
|
|
|
|
| Re: HTML select field where the OPTION text is of different colors [message #172778 is a reply to message #172777] |
Tue, 01 March 2011 00:23 |
Denis McMahon
Messages: 634
Registered: September 2010
Karma: 0
|
Senior Member |
|
|
On 28/02/11 23:33, Captain Paralytic wrote:
>>> <select>
>>> <option>Black_text (yellow_text)</option>
>>> </select>
>> It's impossible. The only one thing that you can try is to emulate
>> select/options by javascript, but it's not easy
> It's impossible is it. I wish you'd told me that before I actually did
> it last year for a client of mine. Now I guess I'll have to tell them
> that they can't use it any more because it is now impossible!
OPs requirement is to have more than 1 colour of text in a single
option. Your solution applies a single colour to the whole of the option.
I would have thought span would work, but it seems it doesn't from the
OPs post, and my own testing confirms that span is not permitted within
option according to the validator, which means applying different styles
to parts of the option text is, at best, problematical
Rgds
Denis McMahon
|
|
|
|
| Re: HTML select field where the OPTION text is of different colors [message #172779 is a reply to message #172777] |
Tue, 01 March 2011 00:41 |
The Natural Philosoph
Messages: 993
Registered: September 2010
Karma: 0
|
Senior Member |
|
|
Captain Paralytic wrote:
> On Feb 28, 1:31 pm, "gemo...@gmail.com" <gemo...@gmail.com> wrote:
>> On Feb 28, 9:52 am, venky_lb <lb.ve...@gmail.com> wrote:
>>
>>> Hi
>>> Is it possible to have an HTML select field where the OPTION text is
>>> of different colors?
>>> <select>
>>> <option>Black_text (yellow_text)</option>
>>> </select>
>>> I tried using an CSS SPAN element to color the text but that doesn't
>>> seem to work.
>>> Any ideas?
>> It's impossible. The only one thing that you can try is to emulate
>> select/options by javascript, but it's not easy
>
> It's impossible is it. I wish you'd told me that before I actually did
> it last year for a client of mine. Now I guess I'll have to tell them
> that they can't use it any more because it is now impossible!
>
> Although this has nothing to do with php, for anyone interested in
> performing the impossible, here is an example of doing it with
> different background colours. I will leave it as an exercise for the
> reader to change it to use text colours (apart from those that find it
> impossible).
> <select onchange="this.style.backgroundColor='#'+this.value;"
> style="background-color: rgb(255, 0, 0);" name="fd_colour" size="1">
> <option style="background-color: rgb(255, 255, 255);"
> value="ffffff">Colour</option>
> <option selected="" style="background-color: rgb(255, 0, 0);"
> value="ff0000"> </option>
> <option style="background-color: rgb(255, 153, 0);"
> value="ff9900"> </option>
> <option style="background-color: rgb(255, 255, 0);"
> value="ffff00"> </option>
> <option style="background-color: rgb(0, 255, 0);"
> value="00ff00"> </option>
> <option style="background-color: rgb(0, 255, 255);"
> value="00ffff"> </option>
> <option style="background-color: rgb(159, 197, 232);"
> value="9fc5e8"> </option>
> <option style="background-color: rgb(215, 172, 255);"
> value="d7acff"> </option>
> <option style="background-color: rgb(255, 0, 255);"
> value="ff00ff"> </option>
> <option style="background-color: rgb(255, 204, 153);"
> value="ffcc99"> </option>
> <option style="background-color: rgb(255, 153, 204);"
> value="ff99cc"> </option>
> <option style="background-color: rgb(204, 255, 204);"
> value="ccffcc"> </option>
> <option style="background-color: rgb(255, 255, 153);"
> value="ffff99"> </option>
> </select>
How many browsers did you actually TRY that one?
My memory is that such tricks (style inside OPTION) work with firefox ,
but not e.g. IE6.
I am fairly sure they worked in the MAC default browser as well..but IE6
stubborn refused to parse them.
Which is why I went the javashit route: It was in the end MORE cross
browser compatible.
|
|
|
|
| Re: HTML select field where the OPTION text is of different colors [message #172790 is a reply to message #172758] |
Wed, 02 March 2011 10:10 |
venky_lb
Messages: 4
Registered: November 2010
Karma: 0
|
Junior Member |
|
|
On Feb 28, 11:52 am, venky_lb <lb.ve...@gmail.com> wrote:
> Hi
>
> Is it possible to have an HTML select field where the OPTION text is
> of different colors?
>
> <select>
> <option>Black_text (yellow_text)</option>
> </select>
>
> I tried using an CSS SPAN element to color the text but that doesn't
> seem to work.
>
> Any ideas?
Thanks for Ur Efforts
|
|
|
|
Calendar
Search
Help
Members
Register
Login
Home
]