Непрозрачность CSS не работает в IE7 или IE8 даже при запущенном hasLayout

Question

У меня есть это слайд-шоу с наложением, которое появляется при наведении курсора, вы можете просмотреть его здесь. Просто наведите курсор мыши на любые фотографии ниже раздела "Избранные". Отлично работает в FF, Webkit, IE9. Я сделал отдельную таблицу стилей для менее чем IE9, и в ней я объявил ширину, высоту, масштабирование, позиционирование, использовал все фильтры, которые работают в IE.... и я не получаю непрозрачность ни в IE7, ни в IE8. DIV с наложением классов добавляется с JQuery, это проблема? Вот мой CSS:

.overlay {
background-color:#fff;
 filter:alpha(opacity=60);
 -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=65);
 zoom:1;
 width:160px;
 height:20px;
 z-index:50;
 position:absolute;
 bottom:0;
 }

Answer 1

Ваша процедура затухания добавляет встроенный стиль, который приводит к progid:DXImageTransform.Microsoft.Alpha(Opacity=60) который переопределяет ваш filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=65) в вашем css. Для рутины затухания характерно использование встроенного стиля, но вы должны убедиться, что он либо заканчивается там, где вам нужно (с непрозрачностью 65%), либо уходит после затухания, чтобы использовать CSS (в Firefox кажется, что он постепенно исчезает со встроенной строкой, а затем удаляет встроенную строку, чтобы прозрачность таблицы стилей была подобрана).

Редактировать (добавлена ​​информация из комментария о затухании с помощью jquery): если вы используете .fadeIn() тогда попробуйте вместо этого использовать .fadeTo(400, 0.65) (см. http://api.jquery.com/fadeTo), 400 - это длительность по умолчанию для .fadeIn(), так что вы можете изменить это, и второе число является окончательной настройкой непрозрачности