Я заметил странное поведение с элементом form select и jQuery .fadeOut / .hide.
У меня есть простое поле select:
<select name="categories">
<optgroup label="Choose option:">
<option selected="selected" value="placeholder">CHOOSE OPTION</option>
<option value="category-books">Books</option>
<option value="category-music">Music</option>
</optgroup>
</select>
И с jQuery я хотел удалить option:selected (мой способ эмулировать заполнитель в этом виде поля), когда пользователь нажимает select с помощью этого кода:
$('select').click(function() {
$('option[value=placeholder]').fadeOut('slow');
});
$('select').blur(function(){
$('option[value=placeholder]').fadeIn('slow');
});
Этот код в Firefox работает, и option плавно исчезает после нажатия, но в других браузерах (IE9, Opera, Chrome) это не работает :-[ Здесь вы можете проверить это: http://jsfiddle.net/cachaito/Xy7DF/3/
Я попробовал .remove (работает) и .hide (нет), но мне нужна анимация, чтобы скрыть этот элемент...
PS. Знаете ли вы лучший способ затухания элемента option, когда пользователь покидает поле select (фокусировка работает так же, как .blur)?