iPad и iPhone браузер вращающихся изображений на сайте?

13

Я испытываю странное вхождение на сайте, который я сейчас строю, где изображения отображаются на 90 градусов иначе, чем они должны, но при сохранении нормальных размеров изображения, которое я указал. Это происходит только на Safari в iPad и iPhone для меня ... все другие браузеры не имеют этой проблемы.

введите описание изображения здесь

Есть идеи?

Страницу, о которой идет речь, можно увидеть здесь: http://www.andrewpeterson.com/i-had-to-be-a-perfect-gentleman-with-the-princesses/

css images iphone ipad Garrett
источник
4
Э-э-э ... у меня нет какого-либо устройства Apple или браузера для проверки ... но, может быть, они читают информацию EXIF ​​(особенно ротацию)? Попробуйте удалить всю дополнительную информацию из этих изображений (хотя бы одно, используйте компрессоры изображений, такие как: punypng.com ) и замените свое изображение на «оптимизированную» версию, а затем посмотрите, помогает ли это (убедитесь, что в браузере установлена ​​текущая версия изображения, так понятно кеши).
LazyOne
2
+1 за проблему, которую я никогда раньше не видел. Еще пара точек данных: IrfanView и Photoshop также загружают верхнее изображение, повернутое, как в Mobile WebKit / Safari. Настольного Safari нет. Это подтверждает идею о том, что она находится в метаданных изображения, хотя там много чего, и я не нашел, какое конкретное свойство делает это здесь, с помощью браузера Photoshop (хотя я не очень разбираюсь в EXIF). Должен дать вам стартовое место, хотя. @LazyOne, если вы хотите опубликовать в качестве фактического ответа, я буду голосовать. Я только что запустил первое изображение через PunyPNG, и это сработало для меня.
Вс
Я сделал это :) Thnx Su '
LazyOne
Была такая же проблема, удаление метаданных сработало!
решил проблему :) Если вам кажется трудным заставить программы удалять метаданные, вы можете открыть изображение в виде краски (включено в окна), отметить его и скопировать, выбрать новое изображение, вставить свою копию и сохранить.

Ответы:

11

Уууу .. У меня нет устройства Apple или браузера для проверки ... но похоже, что они читают метаданные EXIF (в частности, ротацию).

Я открыл одно из этих изображений в XnView - изображение отображается с поворотом на 90 градусов.

Попробуйте удалить всю дополнительную информацию из этих изображений (сделайте это хотя бы для одного изображения). Используйте компрессоры изображений, как этот: punypng.com (или любой другой инструмент, который может удалить детали метаданных ... или просто повернуть его и сохранить снова) и заменить изображение на «оптимизированную» версию.

При повторной проверке на iPad убедитесь, что в браузере установлена ​​текущая версия изображения, поэтому очистите кэши.

PS Thnx Su '

LazyOne
источник
Вот и все! Какая странная вещь для веб-браузера. Я использовал IrfanView, чтобы исправить это (открыть файл и сохранить его без метаданных), и теперь все отображается нормально. Благодарность!
Гарретт
1

Попробуйте использовать JPEG и PNG Stripper http://www.steelbytes.com/?mid=30, а затем удалите всю информацию, связанную с метаданными изображения. Работает нормально.

Anetagama
источник
1

Вот простой способ вручную переопределить метаданные поворота EXIF, если изображение сохранено в правильной ориентации в MS Windows. В проводнике Windows щелкните правой кнопкой мыши файл изображения и выберите «Повернуть по часовой стрелке». Сделайте это 4 раза, чтобы повернуть изображение полностью вокруг, и тогда изображение будет иметь правильную ориентацию для всех систем. Затем вы можете загрузить изображение на свой веб-сервер.

BenW
источник
Это не сработало для меня. Возможно, Windows Explorer сохраняет метаданные в Windows 10, но не поддерживал их в предыдущих версиях?
М Кац
0

Я подал это как ошибку в Apple через Apple Bug Reporter . Если это важно для вас и у вас есть образцы данных, не помешает иметь более одного отчета по этой проблеме. На приведенном ниже снимке экрана следует выделить проблему, и в случае непредвиденного случая сотрудник Apple взглянет на это сообщение, идентификатор проблемы - 11299426.

Непоследовательное Поворотное Поведение

Аарон
источник