Как идентифицировать MS Edge Browser через css, js, UAS ..?

Question

Я использую png с прозрачностью в качестве фонового изображения, которое хорошо отображается везде - кроме версии MS Edge на основе Chromium. Я обновил MS Edge до последней версии, протестировал веб-сайт с неизмененной версией Chromium и на разных компьютерах - проблема сохраняется и возникает только на MS Edge на основе Chromium.

Таким образом, единственным обходным решением будет отключить фоновое изображение для MS Edge - для этого мне понадобится возможность различить браузер Chrome и браузер MS Edge на основе Chromium. До сих пор я не мог найти какое-либо жизнеспособное решение.

У кого-нибудь есть идеи, как настроить таргетинг только на MS Edge на основе Chromium или, в более общем смысле, на браузер MS Edge, включая версию 79 и выше? На данный момент мне все равно, будет ли это достигнуто с помощью CSS или JS, но я бы предпочел селектор CSS.

заранее спасибо.

Answer 1

Поскольку в новой версии MS Edge используется хром, если мы используем метод CSS для определения браузера, стиль может также применяться для браузера Chrome.

Если вы хотите настроить таргетинг только на MS Edge на основе хрома, я предлагаю вам использовать метод JS, проверьте следующий код:

<script>
var browser = (function (agent) {
    switch (true) {
        case agent.indexOf("edge") > -1: return "edge";
        case agent.indexOf("edg") > -1: return "chromium based edge";
        case agent.indexOf("opr") > -1 && !!window.opr: return "opera";
        case agent.indexOf("chrome") > -1 && !!window.chrome: return "chrome";
        case agent.indexOf("trident") > -1: return "ie";
        case agent.indexOf("firefox") > -1: return "firefox";
        case agent.indexOf("safari") > -1: return "safari";
        default: return "other";
    }
})(window.navigator.userAgent.toLowerCase());
document.body.innerHTML = window.navigator.userAgent.toLowerCase() + "<br>" + browser;
</script>

Новое свойство userAgent браузера Microsoft Edge как показано ниже (userAgent содержит значение «edg /»):

mozilla/5.0 (windows nt 10.0; win64; x64) applewebkit/537.36 (khtml, like gecko) chrome/80.0.3987.149 safari/537.36 edg/80.0.361.69