Интерполяция изображений в IE10

Это мой прецедент:Интерполяция изображений в IE10

У меня есть веб-страница с отзывчивым дизайном. Страница вертикально разделена на две половины, справа - я хочу показать изображение (PDF-страницу, представленную как PNG или JPG). Размер изображения должен измениться, как только изменится размер окна.

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

Но тогда есть Internet Explorer 10: Если размер изображения уменьшен до уровня менее 100%, это выглядит как миллион мушек, случайно покрывающих изображение ... Кажется, я не могу найти решение для этого.

Я узнал, что в дни ol (дни) (IE7) для этого было правило CSS -ms-interpolation-mode, которое может быть установлено на bicubic. Но это было объявлено устаревшим и недоступно в IE9 +

Должен ли я принять его так? Как этот параметр можно назвать устаревшим, если нет интерполяции для масштабированных изображений в IE9 +? Есть ли решение для этого?

Я знаю: обычно вы не позволяете вашему браузеру масштабировать ваши изображения. Но есть ли у вас лучшее решение для этого варианта использования?

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

EDIT2: Пожалуйста, повторите проверку (http://jsfiddle.net/7grxut1t/16/), прежде чем закрыть эту тему. Если вы измените размер до очень небольшого размера в Chrome и IE, вы увидите разницу!

Соответствующая часть моего кода

<div> 
    <img src="http://websocket.bplaced.net/test.png"/> 
</div>

CSS:

div { 
    position: relative; 
    width: 50%; 
    height: 100%; 
} 

img { 
    width: 100%; 
}

источник

2015-09-15 devnull69

Я протестировал эту проблему со следующим [скриптом] (http://jsfiddle.net/7grxut1t/1/), но не смог воспроизвести проблему. На IE9-11 все выглядит отлично. Голосование закрывается, если не будут добавлены детали, например скриншоты и/или образцы кода и изображения. –

см. Мое последнее редактирование. Я редактировал вашу скрипту, чтобы включить png, который очень близко соответствует моим вариантам использования. И вы сможете увидеть эффект в IE – devnull69

Я [посмотрел] (http://stackoverflow.com/q/9945363/464709) [вокруг] (http://stackoverflow.com/q/22285959/464709), и, похоже, нам не повезло. Общий консенсус заключается в том, что измененные изображения будут выглядеть ужасно на IE9 +, и вы должны выполнить операцию изменения размера самостоятельно на стороне сервера. Проголосовал за повторное открытие - у кого-то может быть другое решение этой проблемы. –

Хорошо, я нашел довольно грязный, пока применимое обходной

Угловая услуга от https://gist.github.com/fisch0920/37bac5e741eaec60e983 использует элемент холста для интерполяции изображения на лету. Это работает для меня в IE10 (я не уверен в IE9).

Его метод imageService.resizeStep поразительно быстр в IE ... он заметно заметно быстрее, чем встроенный рендеринг интерполяции изображений в Firefox.

Мне это не нравится, но он работает, и он даже не замедляет рабочий процесс пользователя.

источник

2015-09-16 14:34:03 devnull69

Интерполяция изображений в IE10

ответ

Смежные вопросы