Можете ли вы поставить градиент на строку таблицы в IE? - PullRequest
Новая
       12

Можете ли вы поставить градиент на строку таблицы в IE?

4 голосов
/ 24 января 2012

При наведении указателя мыши на строку таблицы в определенной части таблицы я бы хотел, чтобы фон изменился на линейный градиент. CSS прост: 

tbody.row-links tr:hover {
    background: ...typical multi-browser linear gradient code...
    color: #333C3E;
    cursor: pointer;
}

Отлично работает в FF, Chrome и Safari, но не в любой версии IE. Я знаю, что CSS разрешается, потому что цвет и курсор меняются. Я попытался поместить filter на простой тег <tr> и все еще ничего. IE просто игнорирует filter в строках таблицы?

Лучшее, что я могу придумать, это применить градиент к <td> рядам при наведении на ряд, но это вызывает приятное мерцание при наведении курсора на ряд.

Пока я просто выделю IE сплошной цвет фона при наведении. Кто-нибудь еще пробовал и понял это?

1 Ответ

0 голосов
/ 24 января 2012

Вы можете использовать что-то вроде: 

background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlNWU1ZTUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);

для IE9

ИЛИ 

background: -ms-linear-gradient(top,  #ffffff 0%,#e5e5e5 100%);

для IE10

старше IE только с изображениями.

...