Try this,
CSS
.active{
background : #FF0 !important;
}
SCRIPT
$("select").chosen().change(function(){
$('li.search-choice').removeClass('active');
$('li.search-choice:last').addClass('active');
});
Domanda
in the great jquery Chosen plugin (http://harvesthq.github.io/chosen/) is it possible to highlight an option within an multiselect. An image will say more than a description:
EDIT: Sorry for the unclear question. It would be great if the highlight fires by a givven attribute in the option tag. f.e. a class name or a "name"
<option value="xyz" selected="selected" class="active" name="active">item</option>
Thanks,
t book
Soluzione
Try this,
CSS
.active{
background : #FF0 !important;
}
SCRIPT
$("select").chosen().change(function(){
$('li.search-choice').removeClass('active');
$('li.search-choice:last').addClass('active');
});
Altri suggerimenti
You could do something like what you are looking for with css:
.chosen-container-multi .chosen-choices li.search-choice.emphasize {
background-image: linear-gradient(#FFEDB5 20%, #FFAE03 50%, #E09B1F 52%, #DBAD4B 100%);
background-color: #C9AB11;
}
The only other thing you would need to do is select the element you want to highlight and emphasize by adding the class emphasize
. To highlight requires some code I haven't shown but it shouldn't be too hard to create. Best of luck!
I believe you want to color the last multiselect menu. You can use:
$('ul.chosen-choices .search-choice:last span').css('background-color','yellow')
You can use toogleClass like in this working demo.
Like:
$('#target').toggleClass('toggled');
and in your css, use different color for element with toggled class.