Эффект Hover в таблицах действительно в IE10 (предварительный просмотр Win 8)

Question

Недавно я обновил свой настольный ПК до Win 8 Release Preview. До того, как я использовал Consumer Preview, мне очень понравилось, что они оба честны.

Anyways, in Consumer Preview У меня не было проблем с веб-сайтами, которые я делал. Все работало как в IE10, IE9, Chrome, Firefox, Safari. Все это выглядело почти одинаково, за исключением небольших различий, которые каждый браузер имеет. Так что в целом, никаких проблем.

Но после того, как я обновил до версии предварительного просмотра и, следовательно, новую версию IE10, некоторые вещи на тех же сайтах, над которыми я работал в Consumer Preview, не вели себя так, как должны. То, что я говорю, это эффект зависания в некоторых таблицах, которые у меня есть.

CSS для таблиц - это просто обычная таблица, и всякий раз, когда я перемещаю мышь над одной из строк, отображается эффект зависания.

CSS для висения является:

table.Green tr:not(:first-child):hover { 
    background:#dddddd; /* Old browsers */ 
    background:-webkit-linear-gradient(top, #FFFFFF 0%, #dddddd 100%); 
    background:-moz-linear-gradient(top, #FFFFFF 0%, #dddddd 100%); 
    background:-o-linear-gradient(top, #FFFFFF 0%, #dddddd 100%); 
    background:-ms-linear-gradient(top, #FFFFFF 0%, #dddddd 100%); 
    background:linear-gradient(top, #FFFFFF 0%, #dddddd 100%); /* W3C */ 
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF ', endColorstr='#dddddd',GradientType=0); /* IE6-9 */ 
} 

Ничего особенного. Первая строка, в которой есть заголовки столбцов, не должна быть затронута этим, но каждая другая строка должна. И, как я уже сказал, это отлично работало в недавнем IE10 и во всех других браузерах. Но не в новом IE10.

Я приложил изображение, так что вы можете увидеть, что я имею в виду (Работа в Chrome, не работает в IE10 Release Preview):

Как вы можете видеть, первый снимок, есть только ячейки, на которые влияет мягкий градиент (который содержит ссылки. Имя клиента и маленький значок в разделе «Сделка»), а во втором изображении на всю строку влияет градиент.

Я не знаю почему. Но только ячейки, где есть какая-то форма фактической ссылки, будут показывать эффект зависания, а иногда даже возникают проблемы с ответом на эффект мыши. Таким образом, некоторые строки получат эффект наведения, но другие строки в той же таблице не будут, хотя в каждой строке есть один и тот же контент. Это похоже на то, что он очень случайный, какую строку он хочет активировать:/

Итак, это то, что я должен игнорировать, и надеюсь, что это исправится Microsoft, или это важный недостаток в моем HTML/CSS, который внезапно появляется в IE10 Release Preview только?

Надежда кто-то может помочь мне с этим :)

Заранее спасибо

С уважением

Answer 1

linear-gradient синтаксис без префикса не то же самое, как это было в префиксами режимах.

См:

• https://developer.mozilla.org/en/CSS/linear-gradient
• http://blogs.msdn.com/b/ie/archive/2012/06/06/moving-the-stable-web-forward-in-ie10-release-preview.aspx

Цитата из второй ссылки:

Что это значит для вашего кода CSS градиенты

Несмотря на то, что в целом интероперабельность, синтаксис с префиксом градиента, поддерживаемый , все современные браузеры отражают теперь устаревшую черновик версии . Этот более ранний синтаксис несовместим с текущей Рекомендацией кандидата . Например, если вы объявили следующий градиент:

фон: -MS-линейного градиента (слева, желтый, красный);

Тогда получение непереработанного эквивалента - это не просто вопрос удаление префикса -ms-. Поскольку линейный градиент без префикса функция IE10 в соответствует последней спецификации, это должно стать:

фон: линейного градиента (направо, желтый, красный);

Будущее сообщение в блоге будет охватывать поддержку IE10 для CSS-градиентов в более .

В вашем случае, вы должны изменить в background:linear-gradient(top ... вместо top, используйте to bottom.