Intereting Posts
Как показывать запланированные записи в Календаре Google? Передать переменные из одного виджета в другой виджет Перемещение jQuery в нижний колонтитул без использования де-регистра в WordPress Ajax не работает для вставки, запроса и результатов данных Как я могу отображать список уведомлений о приятелях на одной странице или сообщении the_excerpt (); не работает Неупорядоченная боковая панель в панели администратора собственной хостинговой сети Переписать большинство URL-адресов WordPress Я хотел бы знать, если есть простые решения для интеграции других CMS в wordpress Перенаправление URL на пользователя Сохранение метаданных настраиваемых изображений Отдельные функции.php для части сайта Какой инструмент доступен в API WordPress для отладки плагина? Обзор плагина с рейтингом post Является ли шаблон front-page.php зарезервированным для wordpress двадцать двенадцати тем?

изменить изображения the_content для разных размеров (рабочий стол, планшет, мобильный)?

Это может быть сложный вопрос, поэтому я попытаюсь объяснить это как можно проще. У меня есть три размера для изображений в моем сообщении (миниатюра, средний, большой, 640 пикселей, маленький), и я хотел бы изменить размер на основе размера браузера. Я думал о том, чтобы загрузить три изображения (маленький, средний, 640 пикселей) и использовать css для скрытия и отображения изображений на основе размера экрана. Есть ли способ сделать это? Я также открыт для других предложений.

Спасибо, Грегори С.

Solutions Collecting From Web of "изменить изображения the_content для разных размеров (рабочий стол, планшет, мобильный)?"

Хе-хе … могу я спросить вас, в чем смысл этого? Потому что можно подумать, что это необходимо для экономии полосы пропускания и сокращения времени загрузки страницы. Так почему вы всегда хотите загрузить все три из них? display: none будет препятствовать загрузке изображений в DOM. Они все равно будут загружены – просто не покажутся. Просто загрузите самую большую, используйте CSS, чтобы он соответствовал 100% браузера / контейнера, и изображение будет автоматически уменьшено браузером. Таким образом, вы сохраняете время малой и средней нагрузки изображения. И это только для одного изображения. Скажем, кто-то посещает вашу страницу блога (с мобильного телефона) с 20 сообщениями, отображаемыми на странице. С помощью вашего метода вам необходимо утроить количество изображений, которые вы должны загрузить от 20 до 60 (каждый в малом, среднем и большом) – безумие!

Другой подход заключается в том, чтобы определить, какой размер окна используется пользователем (через jQuery), а затем загружать на него определенное изображение. Я уверен, что вы это выясните, так как это не так, чтобы написать такую ​​функцию в jQuery. Например, ниже приведена одна из моих fn, которую я написал для замены изображений для устройств сетчатки. Он работает одинаково – сначала он обнаруживает, является ли устройство высокой плотностью пикселей, и если он заменяет имя в изображении src от «normal» до «retina», поэтому сменяет загружаемое изображение:

 jQuery(document).ready(function(){ if (window.devicePixelRatio > 1) { var images = jQuery('img'); images.each(function(i) { var lowres = jQuery(this).attr('src'); var highres = lowres.replace("normal", "retina"); jQuery(this).attr('src', highres); }); } });