Как сделать уведомление, что браузер устарел?

Question

[kkoshakk]

Я хочу, что бы если пользователь открывает сайт в любой версии ie, кроме Edge, ему выводилось сообщение с просьбой перейти на другой браузер. Я буду использовать такой скрипт для определения ie:

function detectIE(userAgent) {
    userAgent = userAgent || navigator;
    return userAgent.indexOf("MSIE ") > -1 || userAgent.indexOf("Trident/") > -1 || userAgent.indexOf("Edge/") > -1;
}

Как мне лучше сделать, отдельно подключать html страничку со стилем или все в скрипте указать?

Answer 1

[Сергей Зеленский]

<div class="warning-ie"> Ваш браузер устарел!!!</div>

.warning-ie{
   font-size:30px;
   width:100%;
   height:100px;
   line-height:100px;
   text-align:center;
   color:#ff0000;
   background:#000;
   display:none;
}
.show{
 display:block;
}

if(detectIE()){
  document.querySelector('.warning-ie').classList.add('.show');
}

Comments

[kkoshakk]

А если я хочу стилизировать сообщение, например, что бы фон был черным, а надпись большим шрифтом красная?

[kkoshakk]

И насколько я знаю, начиная с 10-й версии ишак не поддерживает условные комментарии

[Сергей Зеленский]

1. прописать стили
2. Не вкурсе был что прекратилась поддержка
3Сделайте скрытый изначально блок с информацией о устаревшем браузере,а потом в js делайте ему display:block

[kkoshakk]

Сергей Зеленский: Мне нужо сделать заголовок, который будет виден только в IE, через стили это не получится?

[Сергей Зеленский]

О боги боги, у вас есть скрипт который определяет браузер, вы делаете блок стилизуете его как вам надо, потом с помощью скрипта упомянутого выше, при условии что браузер IE, делаете блок видимым, еще есть вопросы?

[LittleFatNinja]

Сергей Зеленский: ГДЕ ПРО ПИРАМИДЫ??????????

Answer 2

[herr_kaizer]

Есть такая вот штука.
https://browser-update.org/

Answer 3

[Михаил Лялин]

просто предупредите, какие КОНКРЕТНО функциональные части вашего сайта не будут работать на старых браузерах

Comments

[Михаил Лялин]

https://tech.yandex.ru/browser/constructor/doc/ind...

Answer 4

[kkoshakk]

А как будет производительней?

(для IE 9 и меньше)

<!--[if IE]>
    <link href="css/badbrowser.css" rel="stylesheet">
    <![endif]-->
   
    (для IE 10-11)
    <style>
    @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
      nav {
      display:none;
      }
      body {
        background-color: #e51c23;
        padding-top: 70px;
      }
    }
    </style>

Comments

[Сергей Зеленский]

Зачем писать вопрос в ответах, либо редактируете вопрос либо пишите в комментарий, первый вариант надежнее

[kkoshakk]

Сергей Зеленский: Какой первый?