/    Sign up×
Community /Pin to ProfileBookmark

Dropdown Menu Help!

Copy linkTweet thisAlerts:
Apr 15.2003

Is it possible to make the colors of the text in a dropdown menu different colors for example. A drop down menu with three options (Red, Blue Green) and each of those options has the text of it that color! Help please?

to post a comment
JavaScript

12 Comments(s) ↴

Copy linkTweet thisAlerts:
@AdamGundryApr 15.2003 — The select element (dropdown list), as I understand it, does not have any way of controlling individual list elements. You can control the overall appearance using CSS, but not each line on its own.

I'm not totally certain, of course - anyone else got any ideas?

Adam
Copy linkTweet thisAlerts:
@cyberadeApr 15.2003 — <i>
</i>&lt;form&gt;
&lt;select name="Colours"&gt;
&lt;option value="Red" style="color='red'"&gt;Red&lt;/option&gt;
&lt;option value="Blue" style="color='blue'"&gt;Blue&lt;/option&gt;
&lt;option value="Green" selected="selected" style="color='green'"&gt;Green&lt;/option&gt;
&lt;option value="Orange" style="color='orange'"&gt;Orange&lt;/option&gt;
&lt;/select&gt;
&lt;/form&gt;
Copy linkTweet thisAlerts:
@NevermoreApr 15.2003 — That should be:

[CODE]
<form>
<select name="Colours">
<option value="Red" style="color:red">Red</option>
<option value="Blue" style="color:blue">Blue</option>
<option value="Green" selected="selected" style="color:green">Green</option>
<option value="Orange" style="color:orange">Orange</option>
</select>
</form>[/CODE]
Copy linkTweet thisAlerts:
@cyberadeApr 15.2003 — Ah, well done! You spotted my deliberate mistake!?

Thanks for the update Cijori.
Copy linkTweet thisAlerts:
@JickauthorApr 15.2003 — Thank you guys thats exactaly what I wanted. I works great now. Thanks. ?
Copy linkTweet thisAlerts:
@JickauthorApr 15.2003 — I have another drop down menu on the same page that you can select font face. I wundered if you could use the same operation as the color thing you guys showed me to make it so each font selection in the drop down menu is displayed with its font so like when the user views the drop down menu they will be able to see what the font looks like before they use it. Can anybody help? Thanks. ?

Would it be like this?

<form>

<select name="Font">

<option value="Arial" style="font:arial">Arial</option>

<option value="Verdana" style="font:verdana">Verdana</option>

<option value="Courier" style="font:courier">Courier</option>

<option value="Comic" style="font:comic">Comic</option>

</select>

</form>

Please help! Thanks. ?
Copy linkTweet thisAlerts:
@cyberadeApr 15.2003 — Instead of just 'font' use 'font-family'.

Take a look at http://www.w3schools.com/html/html_fonts.asp for some hints on how to use fonts with style! (Did I just say that?:o )
Copy linkTweet thisAlerts:
@JickauthorApr 15.2003 — I gave this a try but it didn't work?

<form>

<select name="Font">

<option value="Arial" style="font-family:arial">Arial</option>

<option value="Verdana" style="font-family:verdana">Verdana</option>

<option value="Courier" style="font-family:courier">Courier</option>

<option value="Comic" style="font-family:comic">Comic</option>

</select>

</form>

Help please advise? ?
Copy linkTweet thisAlerts:
@NevermoreApr 15.2003 — I don't think you can change anything about the options except for the colour.
Copy linkTweet thisAlerts:
@JickauthorApr 16.2003 — ? Does anybody else have any suggestions?
Copy linkTweet thisAlerts:
@JickauthorApr 18.2003 — Is there a way to do this without flash or any thing. Can it be done with html or javascript? Thanks. ?
Copy linkTweet thisAlerts:
@DrDaMourApr 18.2003 — if font-family doesn't work, then it's not implemented yet, wait for IE8
×

Success!

Help @Jick spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...