Как запретить IE Filters скрывать фоновое изображение - PullRequest
Новая
       31

Как запретить IE Filters скрывать фоновое изображение

2 голосов
/ 08 апреля 2011

Сайт здесь . При нажатии кнопки в меню Internet Explorer будет скрывать значки. Это не поведение в других браузерах. Значок является фоном <a>, чтобы его можно было нажимать. Есть ли способ показать значок при нажатии?

Возможно ли, используя только CSS, что при нажатии <a> фильтр будет применен к <li>?

Таким образом, фоновый значок <a> будет сохранен.

Ответы [ 3 ]

2 голосов
/ 08 апреля 2011

Причина, по которой мы видим эту ошибку, заключается в том, что она рисует градиент над значком, поэтому в качестве временного обходного пути здесь исправлено IE.Там, где у вас есть последний условный тег, поместите прозрачный цвет как endColorStr. 

<!--[if IE]><style type="text/css">
#menu li a:active {
    -ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#476c2c', endColorstr='#000000ff')";
    filter:progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#476c2c', endColorstr='#000000ff');
    padding: 39px 0px 2px 0px;
    margin-bottom:1px;
}
</style><![EndIf]-->
2 голосов
/ 08 апреля 2011

Я нашел решение вашей проблемы.Замените этот код: 

<!--[if IE]><style type="text/css">
#menu li a:active {
    -ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#476c2c', endColorstr='#ccff66')";
    filter:progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#476c2c', endColorstr='#ccff66');
    padding: 39px 0px 2px 0px;
    margin-bottom:1px;
}
</style><![EndIf]-->

На: 

<!--[if IE]><style type="text/css">
#menu li a:active {
    -ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#476c2c', endColorstr='#ccff66') progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://lh5.googleusercontent.com/_qvhVKLFln2A/TZ8U5OiFLlI/AAAAAAAAHqg/7OQqVItePoo/menu_icon.png')";
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#476c2c', endColorstr='#ccff66') progid:DXImageTransform.Microsoft.AlphaImageLoader(src='http://lh5.googleusercontent.com/_qvhVKLFln2A/TZ8U5OiFLlI/AAAAAAAAHqg/7OQqVItePoo/menu_icon.png');

    padding: 39px 0px 2px 0px;
    margin-bottom:1px;
}
</style><![EndIf]-->

Вы получите одно и то же фоновое изображение в каждой ссылке.Решение этой проблемы состоит в том, чтобы просто иметь отдельные изображения для каждой ссылки: информация, чат, ...

0 голосов
/ 08 апреля 2011

Вы пытались установить "a: active" или, возможно, "a: посещения" с тем же фоном?

W3Schools CSS: активный селектор

...