Firefox размывает изображение при масштабировании с помощью внешнего CSS или встроенного стиля.

hmm .. Если бы у вас был список вроде следующего:

<span class="apple">red apple</span>
<span class="apple">green apple</span>
<span class="pear">big pear</span>
<span class="pear">little pear</span>

, следующее следующее:

$("span.*").show();

следующее скроет все элементы с помощью класса = "apple" ':

$("span[class='apple']").hide();

, или вы можете скрывать все, что не имеет «class =" pear ":

$("span[class!='pear']").hide();
23
задан Volker E. 23 April 2014 в 00:52
поделиться

9 ответов

Я обнаружил эту новую функцию FireFox:

http://developer.mozilla.org/En/CSS/Image-rendering

Итак, поместите это в свой CSS исправлю:

image-rendering: -moz-crisp-edges;

Подумал, что поделюсь этой информацией. Извините за ответ на мой вопрос;)

35
ответ дан 29 November 2019 в 01:33
поделиться

Необходимо постараться не масштабировать изображение на стороне клиента. Масштабирование изображения вверх похоже на изменение масштаба, браузер не имеет информации для изображения для отображения его в более высоком разрешении, чем это действительно, таким образом, Вы не можете сделать этого, не размывая изображение, возможно, это не noticebale в IE, попытайтесь измениться на 200 пкс на 400 пкс.

0
ответ дан Vasil 23 April 2014 в 00:52
поделиться

Я просто задавался вопросом об этом сам, но кажется, что это - hardcoded в ff3: ( http://forums.mozillazine.org/viewtopic.php?f=7&t=752735&p=5008845

ff2 не сделал никакой интерполяции

, IE не делает по умолчанию, но можно включить его: http://www.joelonsoftware.com/items/2008/12/22.html

5
ответ дан pixelbeat 23 April 2014 в 00:52
поделиться
  • 1
    Если кто-то делает: функционируйте makeDomElement () {var DOMifier = document.createElement (' div'); DOMifier.innerHTML = " < отделение onClick =' нечто () ' > </div> ";} Будет присоединение слушателя и сохранять это в памяти. У меня есть метод, который берет в любой строке (который мог содержать HTML), и использует созданный в синтаксическом анализаторе DOM для идентификации просто текстовых узлов. Однако я don' t должен сохранить проанализированные Объекты DOM. I' m боящийся, если какая-либо строка может присоединиться назад к DOM тогда I' ll имеют утечку. – Chris Stephens 8 August 2013 в 14:39

Вы увеличиваете масштаб изображения от его первоначального размера - желаемый эффект обычно для имения гладкого масштабирования, и казалось бы, что FFX3 начал делать это (я принимаю билинейную фильтрацию). Я думаю, смотрите ли Вы на Safari и Opera, Вы найдете, что они также фильтруют изображение.

4
ответ дан olliej 23 April 2014 в 00:52
поделиться

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

я не думаю, что существует способ обойти его все же.

1
ответ дан Patrik Hägne 23 April 2014 в 00:52
поделиться

К сожалению, у меня нет решения для этого, но это - полный dealbreaker для большого количества пользователей (например, пиксельные художники). Если Вы затронуты этим, отправьте отклик http://hendrix.mozilla.org/ и голосование за соответствующая ошибка .

неутешительно, что Mozilla игнорирует эту проблему. Для многих нужных пользователей это означает, что нет никакого другого выбора, чем переключить браузеры. IE имеет свойство CSS для выбора фильтра изменения размеров, таким образом, это, кажется, лучший выбор.

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

1
ответ дан nikow 23 April 2014 в 00:52
поделиться

http://developer.mozilla.org/En/CSS/Image-rendering относится только к текущие сборки ствола Firefox (Minefield / 3.6a1pre / Gecko 1.9.2). Эта функция отсутствует в Firefox 3.0 и не будет в следующей версии 3.5. Первым выпуском с этой опцией станет следующий основной выпуск после 3.5, который в настоящее время находится на ранних стадиях планирования, а ориентировочный выпуск ожидается в 2010 году.

2
ответ дан 29 November 2019 в 01:33
поделиться

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

1
ответ дан 29 November 2019 в 01:33
поделиться

Internet Explorer 8 также "размывает" изображения по умолчанию при их масштабировании. На самом деле это хорошо. Большинство изображений выглядят лучше при масштабировании с использованием бикубической выборки вместо выборки ближайшего соседа.

Если вы хотите, чтобы Internet Explorer 8 масштабировал изображения, как это делают предыдущие версии, поместите это в свой CSS:

-ms-interpolation-mode: nearest-neighbor;

Если вы хотите, чтобы Internet Explorer 7 масштабировал изображения, как IE 8, используйте это:

-ms-interpolation-mode: bicubic;

Кроме внешнего вида изображение, вы также должны учитывать производительность. Я обнаружил, что IE 7 и IE 8 требуют значительно большей мощности процессора для масштабирования изображений при использовании бикубической выборки, чем Firefox 3.6.

2
ответ дан 29 November 2019 в 01:33
поделиться
Другие вопросы по тегам:

Похожие вопросы: