«
»
jQueryWEBWordPressWordPress - jQuery

WordPress – автоматически удаляем высоту (height) изображений благодаря jQuery

height — css атрибут изображения указывающий высоту картинки, данный атрибут весьма полезен, но вместе с атрибутом wedith (ширина изображения на блоге)  растягивает или стягивает картинку на мобильных устройствах. В этой статье пойдет речь о том как удалить атрибут высоты из всех изображений сайта не прибегая к ручному удалению.

Для чего нужен скрипт:

Так получилось что CMS WordPress при вставке изображений на страницы, записи, виджеты и т.д., по умолчанию вставляет в ссылку изображения атрибуты ширины и высоты, что в свою очередь очень хорошая штука, так как дает понимание браузерам как отображать картинку. Но в случае с адаптивным интерфейсом эти атрибуты могут сыграть злую шутку, ведь именно за счет них картинка при открытии записи на мобильном устройстве растягивается или стягивается.

Скрипт:

Для адекватного отображения уже имеющихся картинок на сайте нам придет на помощь данный скрипт:

<!--Remove height in to image--> <script src="//code.jquery.com/jquery-latest.js"></script> <script type="text/javascript"> jQuery.noConflict(); jQuery(document).ready(function($){ $('img').each(function(){ $(this).removeAttr('height'); }); }); </script> <!--END--Remove height in to image-->

Что делает скрипт:

Скрипт удаляет из изображений атрибут высоты (height), оставляя атрибут ширины (wedith) за счет чего картинка будет отображаться красиво и в нормальном размере на любых устройствах.

Данный скрипт необходимо установить в файл header.php  сразу после открывающегося тега <head>.

Ка выглядит картинка по умолчанию на блоге при просмотре записи блога на мобильном телефоне:

Вот как выглядит картинка после применения скрипта:

Скрипт оригинал находится здесь (удаляет и высоту и ширину): http://wpwizard.net/jquery/remove-img-height-and-width-with-jquery/

Источник записи: https://mediadoma.com

Связанные записи
WordPressПлагины

Как принимать пожертвования? 4 лучших плагина для пожертвований на сайте WordPress.

WEB

Beaker Browser - Одноранговый браузер для веб-хакеров и разработчиков.

WordPressПлагиныПолезные сайты

Бесплатные и платные решения для клонирования (дублирования) WordPress сайта

WordPressПлагины

Как получить больше подписчиков электронной почты на вашем сайте WordPress