Reputation: 4630
While working fine Chrome and IE7-9, firefox brings yet another surprise...
What I'm trying to do is to change the color of Select
according to the color of the selected option
. For some mysterious reason it doesn't work in firefox.
Any ideas why?
$('#selectstat_sch').change(function(){
$(this).css('color',$('option:selected',this).css('color'));
}).trigger('change');
Upvotes: 1
Views: 140
Reputation: 35084
When the option is selected, it gets a different computed color than the one in your HTML, because there's a UA sheet rule that styles selected options. You can see this, in fact: the selected option is white with a blue background.
So instead of getting the computed color from the option, you may want to just get .style.color
, since that's what you want,
Upvotes: 0
Reputation: 4630
Elaborating on the undefined, we may want to validate first our css property,
This should also work if some other properties are present.
var style=$('option:selected',this).attr('style');
var matches=style.match(/color:([^;]+)/);
if (matches) $(this).css('color',matches[1]);
//else alert('no match');
Upvotes: 1
Reputation: 43676
Use the attr('style') instead css('color'):
$(document).ready(function(){
$('#selectstat_sch').change(function(){
$(this).attr('style',$('option:selected').attr('style'));
});
});
but this copy and overwrites the whole styles.
Upvotes: 0