Удаление IE10 Стрелка выбора элемента

Итак, с Mozilla и WebKit у меня есть полуприличное решение, заменяющее стрелку в поле select с помощью appearance: none; и иметь родительский элемент.

В IE по большей части я отключил эту функцию. Для IE10 я не могу его отключить, потому что мои условные комментарии не работают.

Вот моя разметка:

<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->
<!--[if IE 7 ]>    <html class="ie7"> <![endif]-->
<!--[if IE 8 ]>    <html class="ie8"> <![endif]-->
<!--[if IE 9 ]>    <html class="ie9"> <![endif]-->
<!--[if (gt IE 9)]>    <html class="ie10plus"> <![endif]-->
<!--[if !(IE)]><!--> <html> <!--<![endif]-->

Класс ie10plus на самом деле не подходит к разметке.

Я также чувствую, что в IE может быть законный способ заменить стрелку. Я не против фактического решения проблемы. appearance: none;, однако, не работает. Так что я могу сделать здесь?

73 голоса | спросил Parris 12 MaramTue, 12 Mar 2013 05:53:50 +04002013-03-12T05:53:50+04:0005 2013, 05:53:50

5 ответов


0

Избегайте сниффинга в браузере и условных комментариев (которые не поддерживаются в Internet Explorer 10), а вместо этого используйте более стандартный подход. С этой конкретной проблемой вы должны ориентироваться на ::-ms-expand псевдоэлемент:

 select::-ms-expand {
    display: none;
}
ответил Sampson 10 PMpWed, 10 Apr 2013 22:38:46 +040038Wednesday 2013, 22:38:46
0

Но !, если мы хотим добавить ширину, мы не можем сделать это так:

display:none

Итак,

select::-ms-expand {
 /* IE 8 */
 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 /* IE 5-7 */
 filter: alpha(opacity=0);
 /* Good browsers :) */
 opacity:0;
}
ответил Sergey 21 Mayam14 2014, 11:52:36
0

Internet Explorer 10 не поддерживает условные комментарии , так что вам придется сделать что-то еще. Одним из решений является прослушивание пользовательского агента с помощью JavaScript и добавление класса самостоятельно:

<script>
if (navigator.userAgent.indexOf("MSIE 10.0") !== -1) {
    document.documentElement.className += " ie10";
}
</script>

Вероятно, вам следует добавить это в <head>, чтобы у вас не было флэш-памяти нестандартного содержимого, но это может быть проблема.

Кроме того, если вы используете jQuery, вы можете сделать что-то вроде этого:

if (navigator.userAgent.indexOf("MSIE 10.0") !== -1) {
    $("html").addClass("ie10");
}

Если вы хотите проверить IE10 или выше, скопируйте и вставьте функцию getInternetExplorerVersion со страницы Microsoft , а затем измените if примерно так:

if (getInternetExplorerVersion() >= 10) {
    // whatever implementation you choose
}
ответил Evan Hahn 12 MaramTue, 12 Mar 2013 06:05:00 +04002013-03-12T06:05:00+04:0006 2013, 06:05:00
0

У меня возникла проблема со скрытой стрелкой раскрывающегося списка на сайте IE 10 и 11, над которым я работаю, который использует Zurb Foundation . На _form.scss была строка, в которой было

select::-ms-expand {
    display: none;
}

Я удалил , и стрелка раскрывающегося списка начала нормально отображаться на всех броузерах. Спасибо Джонатан за ваш ответ здесь. Это помогло мне после многих поисков решения.

ответил ranjeesh 14 Maypm14 2014, 20:33:34
0

все еще не уверен, что вы пытаетесь выполнить, но это обнаружит и добавит класс для ie10:
<!--[if !IE]><!--<script> if (/*@[email protected]*/false) { document.documentElement.className+=' ie10plus'; } </script>!--<![endif]-->

ответил albert 12 MaramTue, 12 Mar 2013 08:15:32 +04002013-03-12T08:15:32+04:0008 2013, 08:15:32

Похожие вопросы

Популярные теги

security × 330linux × 316macos × 2827 × 268performance × 244command-line × 241sql-server × 235joomla-3.x × 222java × 189c++ × 186windows × 180cisco × 168bash × 158c# × 142gmail × 139arduino-uno × 139javascript × 134ssh × 133seo × 132mysql × 132