Почему компьютеры Mac без сетчатки загружают 2-кратную версию элемента изображения?

Я использую picturefill 2.0 и элемент изображения с некоторыми динамическими URL-адресами.

<picture alt="<?php the_title(); ?>" title="<?php the_title(); ?>">
    <source srcset="<?php echo $tablet; ?>, <?php echo $tablet; ?> 2x" media="(max-width: 950px)">
    <source srcset="<?php echo $laptop; ?>, <?php echo $laptop; ?> 2x" media="(max-width: 1440px)">
    <img srcset="<?php echo $desktop; ?>, <?php echo $desktop; ?> 2x">
</picture>

Я создал изображение, которое в два раза больше и используется, если я обнаруживаю дисплей сетчатки через файл cookie.

Если сетчатка не обнаружена, то эти переменные являются просто изображениями нормального размера.

Проблема, с которой я сталкиваюсь, заключается в том, что Mac без сетчатки загружают изображение <?php echo $desktop; ?> 2x из элемента изображения.

Если я уберу опцию 2x из изображений элементов изображения, они будут загружаться нормально.

Разве это изображение не должно быть загружено только устройствами с дисплеями сетчатки?


macos javascript html picturefill retina-display
person UzumakiDev    schedule 26.01.2015    source источник
comment
не могли бы вы ввести devicePixelRatio внутри своей консоли и посмотреть, что будет возвращено?   -  person alexander farkas    schedule 28.01.2015
comment
а, хороший совет, я попробую это, спасибо.   -  person UzumakiDev    schedule 28.01.2015

Ответы (1)


arrow_upward
1
arrow_downward

Не выводите одно и то же изображение как в 1x, так и в 2x, в зависимости от того, что вы обнаружите. Вам не нужно ничего обнаруживать. Просто выведите изображение 1x как 1x, а изображение 2x как 2x. Браузер может свободно загружать любое изображение из srcset по своему усмотрению.

person zcorpan    schedule 26.03.2015