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

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

1 голос
/ 05 января 2012

У меня есть это слайд-шоу с наложением, которое появляется при наведении курсора, вы можете просмотреть его здесь .Просто наведите курсор мыши на любую фотографию ниже раздела «Избранные».Отлично работает в 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;
 }

1 Ответ

2 голосов
/ 05 января 2012

Ваша процедура затухания добавляет встроенный стиль, который приводит к 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(), так что вы можете изменить ее, а второе число - это окончательная настройка непрозрачности

...