Так, это официально: Я ненавижу Internet Explorer. Да, все кровавые версии его.:-D
Так, я не думал, что делал что-либо сложное здесь, но по-видимому я. У меня есть набор элементов списка в незаказанном списке, разработанном для навигационного меню, и в Firefox, Chrome, Safari и Opera, вещи хорошо работают. То, что, как предполагается, происходит, - когда Вы толпитесь навигационный объект, он должен анимировать некоторый рост и анимировать изменение цвета фона.
Ничего не происходит в Internet Explorer 7/8.
Я думаю, что это просто связывается с анимационной функцией, с тех пор если я подкачиваю .animate с .css, это работает.
http://project-cypher.net/wtf/ (*url удаленный - решенная проблема)
Идеи?
Немного измените свойства анимации, используя backgroundColor
, paddingTop
и paddingBottom
, это должно работать:
$('ul.navigation li a').css('padding','0px 12px');
$('ul.navigation li a').hover(function() {
$(this).stop().animate({
backgroundColor : '#336699',
'padding-top': 6,
'padding-bottom': 6
}, 150 );
}, function() {
$(this).stop().animate({
backgroundColor: '#660000',
paddingTop: 0,
paddingBottom: 0
}, 150 );
});
Этот CSS:
ul.navigation li a {
padding: 6px 12px;
color: #fff;
text-decoration: none;
background: #600;
}
На днях я сам столкнулся с этой проблемой. Я не мог понять, почему IE не анимировал объекты должным образом.
Ответ прост: используйте jQuery UI
jQuery UI включает улучшенный плагин цвета, который действительно работает .
Оцените другие удобные функции пользовательского интерфейса jQuery, пока вы работаете с ним - кнопки, диалоговые окна, индикаторы выполнения, вкладки и т. Д.
Если я изменю 'padding': '6px 12px' на 'padding': '12px', похоже, это сработает. Можете ли вы попробовать это и сообщить, если это не сработает с вашей стороны?
Это не идеально, но что-то делает и приближает вас к тому, чтобы это исправить.
РЕДАКТИРОВАТЬ: Черт, интересно, почему бы и нет. Работал здесь. IE8. IDK, возможно, у вас есть решение из другого ответа.