Любые предложения по "перетаскиванию" фонового изображения на IE10-11? - PullRequest
0 голосов
/ 05 февраля 2019

У меня есть нижний колонтитул, который является фоновым изображением и прокручивается по горизонтали вместе со страницей.На IE10-11 изображение вроде перетаскивается / смазывается.Конечно, это нормально во всех других браузерах.

К сожалению, я не могу поделиться сайтом разработчика по причинам клиента, но вот короткое видео проблемы.Извините за изменчивость, но я думаю, что вы можете видеть проблему с зеленой частью в изображении нижнего колонтитула.https://drive.google.com/file/d/1j7c8w378EzlSPknHAIGhfBnir546DmqU/view?usp=sharing

Вот CSS для моего нижнего колонтитула:

#footer {
    height: 30%;
    background: transparent url(../img/footer.png) repeat-x;
    background-position-x: 0px;
    position: fixed;
    bottom: 0;
    left:0;
    width: 100%;
    background-size: cover;
    background-size: auto 100%;
    background-repeat: repeat-x;
    z-index: 100;
}

И JS:

$(document).on('scroll', (function() {
    // handles the scrolling of the footer
    $('#footer').css('background-position-x', -$(document).scrollTop());
}));

1 Ответ

0 голосов
/ 06 февраля 2019

То, что вы испытываете, это неспособность IE правильно отобразить .png файлы с прогрессивной прозрачностью, также известной как «ошибка png».

Существует несколько способов ее устранения, все они называются «png hack» или аналогичными.

Один из самых надежных и простых в применении - IE PNG fix ,

Подробнее об этом (и поиске альтернативных исправлений) вы можете прочитать в этой уловке CSS article .
Если возможно, для вашего примера отказ от прогрессивной прозрачности (сохранение в формате PNG-8)) скорее всего поможет.

...