stijl van een option value aanpassen

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Bob Devlees

bob Devlees

14/07/2011 16:12:17
Quote Anchor link
Hier ben ik weer met een vraagje.

Ik probeer 1 van mijn options van een select box een bepaalde stijl te geven, dit doe ik als volgt:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
<option value="test" style=\"color: red; font-weight: bold;\">test</option>


Het probleem is dat ik deze stijl wel zie in de dropdownbox, maar als ik het selecteer krijgt het terug de normale stijl (geen kleur, niet bold). In IE doet hij het wel goed, maar Mozilla en Chrome willen niet mee, en moet natuurlijk ook lukken hier..

Is er een manier om dit te omzeilen of op te lossen?
 
PHP hulp

PHP hulp

25/01/2021 17:41:22
 
Obelix Idefix

Obelix Idefix

14/07/2011 17:27:05
Quote Anchor link
Waarom gebruik je escape?
Opmaak/stijl beter via css

Denk eerder dat IE het 'per ongeluk' goed doet.
 
Bob Devlees

bob Devlees

14/07/2011 17:33:27
Quote Anchor link
Ja, dat blijft toch hetzelfde? Nu ik snap wel wat je bedoelt, maar dit gaat het probleem niet wegnemen denk ik?

Is dit wel mogelijk wat ik wil bereiken?
 
Tim S

Tim S

14/07/2011 18:35:15
Quote Anchor link
Om hem ook zo gestyled te zien als hij geselecteerd is moet je het <select> element stylen. Je zou dat kunnen opvangen met javascript. dus detecteren wanneer die ene optie gekozen wordt, en dan hem op die manier ook je <select> stylen.
 
Wouter J

Wouter J

14/07/2011 18:35:18
Quote Anchor link
Gebruik nooit inline CSS, dus height="" style="" ect.. Verder geef je deze stijl mee aan de option tag. Zodra je iets hebt geselecteerd en je gaat er met je muis vanaf zie je niet een option tag, maar een select tag. Stijl die select tag ook eens en je zult zien dat het werkt.
 
Joris van Rijn

Joris van Rijn

14/07/2011 19:05:26
Quote Anchor link
Quote:
Gebruik nooit inline CSS, dus height="" style="" ect..


Kan je dit motiveren?
 
Wouter J

Wouter J

14/07/2011 19:21:02
Quote Anchor link
Ja, het is een ramp bij het onderhouden van een pagina. Als elke style maar ergens in een document staat is het een erg gedoe om wat style te veranderen.
Daarnaast is het gebruik van een stylesheet en classes/ids beter aangezien je makkelijk meerdere element kan stylen.

Verder kan je met een stylesheet goed gebruik maken van bepaalde overruled styles die met inline style niet werken.

En je moet ook gewoon kijken naar het gebruik van een taal. HTML is voor het semantisch weergeven van data en CSS voor het stylen. Het gebruik van style is HTML dus totaal niet voor gemaakt.
 
John Acid

John Acid

14/07/2011 19:21:33
Quote Anchor link
Inline opmaak(css) is niet meer van deze tijd, tegenwoordig worden structuur(html) en opmaak(css) gescheiden gehouden om diverse redenen, de belangrijkste is wel dat je dan een schone html code krijgt en via externe stylesheets een veel efficientere opmaak krijgt.
 
Bob Devlees

bob Devlees

14/07/2011 20:06:53
Quote Anchor link
Mm, ik weet niet goed hoe ik dit moet nagaan met Javascript, ben daar zelf geen held in.

Ik heb ergens op internet een scriptje gevonden wat miss een basis zou kunnen zijn:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<html>
<head>
<title>Select</title>
<script language="JavaScript">
function displayOption(divName)
{
 document.getElementById(divName).innerText=document.form1.select1.options[document.form1.select1.selectedIndex].value;
}
</script>
</head>
<body bgcolor="#FFFFFF">

<!--BEGIN FORM-->
<form name="form1">
   <select name="select1" onChange="displayOption('div1');">
      <option value="India">India</option>
      <option value="USA">USA</option>
      <option value="UK">UK</option>
   </select>
</form>
<!--END FORM-->

<div id="div1" style="font-family:verdana,arial,helvetica; font-weight:bold; color:#FF0000"></div>

</body>
</html>


Maar hier gaat hij dus volgens mij altijd het geselecteerde een andere kleur geven. Het is de bedoeling dat dit enkel gebeurd bij de option met value="SLX"..



Toevoeging op 15/07/2011 13:22:11:

Iemand? :)
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.