Выравниваем высоту блоков с помощью Right-height

В такой ситуации на помощь верстальщику «приходят» различные инструменты на JavaScript. Большинство из подобных инструментов работают совместно с библиотекой jQuery, но есть и независимые от нее скрипты. Недавно я нашел один из них. Этот скрипт называется Right-height. На мой взгляд — очень полезная и достойная вещь. Он небольшой (в сжатом виде «весит» всего 1 кБ), не зависит от jQuery, прост в использовании. Работает во всех современных браузерах, в IE, начиная с версии 9.

Что же нужно сделать, чтобы использовать Right-height на своем сайте? Для начала его нужно скачать с GitHub, разархивировать и подключить к страничкам своего сайта.

Обратите внимание: разметка блоков, у которых нужно выровнять высоту, должна содержать определенные атрибуты. По-умолчанию, в код «родительского» блока нужно добавить атрибут data-right-height, а у блокам с содержимым атрибут data-right-height-content.

Чтобы активировать работу инструмента Right-height, нужно добавить пару строк кода:

JavaScript

<script>
  window.onload = function(){
     rightHeight.init();
  } 
</script>

Вы можете изменить имена атрибутов, которые необходимо добавлять блокам с содержимым. Просто передайте значение двух свойств (selector и selectorContent) в метод rightHeight.init.

В общем, в использовании инструмента Right-height ничего сложного.

Я создал небольшую страничку для демонстрации работы Right-height. Ознакомиться с ней можно здесь.