IE9: зависший глюк - PullRequest
Новая
       27

IE9: зависший глюк

2 голосов
/ 12 октября 2011

У меня есть действительно странное поведение, возникающее в IE9,: hover и свойство фона CSS.

Это почти так, как будто свойства hover и non-hover меняются местами, когда они не должны (В другихсловами, свойства наведения становятся не-свойствами наведения).Я тестировал только с цветом фона, а также с SVG-градиентом.Вот тестовый код (с закомментированным SVG-кодом). 

<!DOCTYPE html>
<html>
<head>
<style type="text/css">
    .highlights {           
        background:black;

        /* SVG background gradient for #0791F3 to #068CE0 */    
        /*
        background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9ImczMDkiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiMwNzkxRjMiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiMwNjhDRTAiIG9mZnNldD0iMSIvPgo8L2xpbmVhckdyYWRpZW50Pgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2czMDkpIiAvPgo8L3N2Zz4=);
        */

    }


    .highlights:hover {
        background:gray;

        /* SVG background gradient for #0064ff to #0051ff */
        /*
        background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc0NDEiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+CjxzdG9wIHN0b3AtY29sb3I9IiMwMDY0RkYiIG9mZnNldD0iMCIvPjxzdG9wIHN0b3AtY29sb3I9IiMwMDUxRkYiIG9mZnNldD0iMSIvPgo8L2xpbmVhckdyYWRpZW50Pgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2c0NDEpIiAvPgo8L3N2Zz4=);
        */

    }

</style>
</head>
<body>

<div class="highlights">
    <h3 class="title" style="color:#FED704">The Quick Brown Fox Jumps Over The Lazy Dog</h3>
    <p style="color:white;">This is smaller text</p>
</div>

</body>
</html>

[править]: видео странного поведения (помните, что фон при наведении должен отображаться серым цветом): http://www.youtube.com/watch?v=8D4Oj25bPlg

1 Ответ

1 голос
/ 13 октября 2011

Программный рендеринг не был включен. Как только я включил его, проблема исчезла.

Свойства обозревателя> «Вкладка« Дополнительно »»> отметьте «Использовать программный рендеринг вместо графического рендеринга»

...