FUDforum
Fast Uncompromising Discussions. FUDforum will get your users talking.

Home » Imported messages » comp.lang.php » HTML select field where the OPTION text is of different colors
Show: Today's Messages :: Polls :: Message Navigator
Switch to threaded view of this topic Create a new topic Submit Reply
HTML select field where the OPTION text is of different colors [message #172758] Mon, 28 February 2011 06:52 Go to next message
venky_lb is currently offline  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 Go to previous messageGo to next message
Andy is currently offline  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 Go to previous messageGo to next message
gemoroy(at)gmail(dot)com is currently offline  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 Go to previous messageGo to next message
Erwin Moller is currently offline  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 Go to previous messageGo to next message
venky_lb is currently offline  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 Go to previous messageGo to next message
Jerry Stuckle is currently offline  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 Go to previous messageGo to next message
The Natural Philosoph is currently offline  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 Go to previous messageGo to next message
The Natural Philosoph is currently offline  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 Go to previous messageGo to next message
Captain Paralytic is currently offline  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">&nbsp;</option>
<option style="background-color: rgb(255, 153, 0);"
value="ff9900">&nbsp;</option>
<option style="background-color: rgb(255, 255, 0);"
value="ffff00">&nbsp;</option>
<option style="background-color: rgb(0, 255, 0);"
value="00ff00">&nbsp;</option>
<option style="background-color: rgb(0, 255, 255);"
value="00ffff">&nbsp;</option>
<option style="background-color: rgb(159, 197, 232);"
value="9fc5e8">&nbsp;</option>
<option style="background-color: rgb(215, 172, 255);"
value="d7acff">&nbsp;</option>
<option style="background-color: rgb(255, 0, 255);"
value="ff00ff">&nbsp;</option>
<option style="background-color: rgb(255, 204, 153);"
value="ffcc99">&nbsp;</option>
<option style="background-color: rgb(255, 153, 204);"
value="ff99cc">&nbsp;</option>
<option style="background-color: rgb(204, 255, 204);"
value="ccffcc">&nbsp;</option>
<option style="background-color: rgb(255, 255, 153);"
value="ffff99">&nbsp;</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 Go to previous messageGo to next message
Denis McMahon is currently offline  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 Go to previous messageGo to next message
The Natural Philosoph is currently offline  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">&nbsp;</option>
> <option style="background-color: rgb(255, 153, 0);"
> value="ff9900">&nbsp;</option>
> <option style="background-color: rgb(255, 255, 0);"
> value="ffff00">&nbsp;</option>
> <option style="background-color: rgb(0, 255, 0);"
> value="00ff00">&nbsp;</option>
> <option style="background-color: rgb(0, 255, 255);"
> value="00ffff">&nbsp;</option>
> <option style="background-color: rgb(159, 197, 232);"
> value="9fc5e8">&nbsp;</option>
> <option style="background-color: rgb(215, 172, 255);"
> value="d7acff">&nbsp;</option>
> <option style="background-color: rgb(255, 0, 255);"
> value="ff00ff">&nbsp;</option>
> <option style="background-color: rgb(255, 204, 153);"
> value="ffcc99">&nbsp;</option>
> <option style="background-color: rgb(255, 153, 204);"
> value="ff99cc">&nbsp;</option>
> <option style="background-color: rgb(204, 255, 204);"
> value="ccffcc">&nbsp;</option>
> <option style="background-color: rgb(255, 255, 153);"
> value="ffff99">&nbsp;</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 Go to previous message
venky_lb is currently offline  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
  Switch to threaded view of this topic Create a new topic Submit Reply
Previous Topic: Problem with attaching file (from a form) to email in PHP
Next Topic: Parsing Error
Goto Forum:
  

-=] Back to Top [=-
[ Syndicate this forum (XML) ] [ RSS ]

Current Time: Sun Nov 10 16:07:29 GMT 2024

Total time taken to generate the page: 0.02236 seconds