Internet Explorer 11 изображение в пикселях

Question

логотип моего сайта находится в Internet Explorer (мой тест был сделан с Internet Explorer 11), очень пикселированный.Логотип выглядит красиво в других браузерах (Safari, Chrome, Mozilla Firefox).Вы, пожалуйста, помогите мне, мы изображение настолько уродливым.

Я использовал Internet Explorer 11 (Версия: 11.407.17134.0)

Далее я следовал руководству под: IEИсправление
Но у меня не было успеха с этим руководством ...

Свойства изображения (логотипа): Размер изображения: 5549 x 1101
Размер файла: 56 КБ
Скриншот проблемы .

Редактировать :
На текущем скриншоте вы можете найти только текстовый логотип.В будущем я заменю его на логотип (изображение).Мой дизайнер еще не закончил, поэтому его нет на скриншоте.Извините за это!

Код CSS:

@media all and (min-width:768px)
body[data-subdomain='customer'] .navbar-brand, body[data-subdomain='school'] .navbar-brand, body[data-subdomain='parents'] .navbar-brand, body[data-subdomain='admincenter'] .navbar-brand {
    background: url(../img/logo.png) no-repeat left center;
    background-size: contain;
    width: 210px;
    margin-left: 15px;
    -ms-interpolation-mode: bicubic;
}

Редактировать :
JSFiddle: https://jsfiddle.net/hxaeuyp0/11/

Answer 1

Параметр -ms-interpolation-mode работает только в IE6-IE8, но был удален в IE9.Таким образом, это не повлияет на результат.

Вы можете решить проблему, используя плагин, который называется «Crossbrowser-Bicubic-Image-Interpolation».

Я только что изменил некоторые частикод из аналогичной темы выпуска ( пиксельная пиктограмма IE, когда для изображения с высоким разрешением установлен маленький размер ), который хорошо работает.

Вот код тестирования.

<script src="https://rawgit.com/sukhoi1/Crossbrowser-Bicubic-Image-Interpolation/master/bicubicInterpolation.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('img.first').bicubicImgInterpolation({
            crossOrigin: 'anonymous' 
        });
    });
</script>

<img id="someId" class="first" width="200" src="https://i.imgur.com/pJtQtzR.png">

Подробнее о проблеме пикселизации можно узнать по этой ссылке: https://github.com/sukhoi1/ie-bicubic-img-interpolation-plugin/wiki