Часто вид блочной верстки портится из-за разной высоты блоков (контейнеров) соседних колонок.
Упростить задачу по выравниванию высоты контейнеров и призван jQuery плагин Simple EQH.
Возможности плагина
1. Автоматическое выравнивание высоты указанных блоков по наиболее заполненному блоку, подобно тому как это происходило бы в табличной вёрстке.
2. Настраиваемые слекторы (классы) для указания блоков.
Установка
1. Подключаем плагин после подключения библиотеки jQuery
<script src="//simpleeqh.js" type="text/javascript"></script>
2. Активируем плагин добавив следующий код в тело вашей страницы, или добавив его в ваш скрипт файл:
$(window).load(function(){
$(".auto-height").simpleEQH();
});
Этот код выравняет высоту всех блоков с классом auto-height.
Если необходимо привести блоки с разными классами к одной высоте, то необходимо использовать следующий код:
$(window).load(function(){
$(".auto-height, .auto-height2").simpleEQH();
});
Этот код выравняет высоту блоков с классами auto-height и auto-height2 по наиболее заполненному блоку.
Если необходимо выравнять блоки с разными классами, каждый по наибольшему блоку своего класса, используем следующий код:
$(window).load(function(){
$(".auto-height").simpleEQH();
$(".auto-height2").simpleEQH();
}); JoomShopping Download & Support
Расширения Joomla и JoomShopping, представленные на нашем сайте, разработаны нами. Мы не воруем и не продаём чужой труд. Приобретая расширения у нас, вы получаете поддержку и сопровождение.
Все расширения на нашем сайте можно оплатить после тестирования. Для получения ссылки на скачивание расширения просто оформите заказ.
Реквизиты для оплаты:
Яндекс деньги, ЮMoney - 41001160794290,
MasterCard - 5106 2180 3412 6789,
Сбербанк - 4276 5500 2460 9425
Расширения
Комментарии
Выход: переименовать класс
Хорошо, что помогло. Не забывайте, что длинные названия можно сокращать с помощью css свойства text-overflow: ellipsis; не прибегая к js или php.
Например, если текст содержится в блоке с классом name в теге "a", можно написать:
Код:
.name a { width: 100%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; display: block; }
Ну, и для отображения всего текста при наведении:
Код:
.block_product:hover .name a { white-space: normal; }
Это круто! Я рад без памяти! три дня не мог победить эту проблему, а тут такое простое и эффективное решение!. Спасибо большое за офигенский плагин!
Попробуйте. Плагин должен помочь.
У меня на клубных шаблонах в ЖШ некорректно отображаются товары на странице категории. Это происходит из-за длиниы названия товара. Там, где название длиннее, сам блок становится выше, в связи с чем под него не становится другой товар, а переезжает вправо под блок с нормальной высотой. Этот плагин то, что мне нужно, или я неправильно понял?
Вызвать функцию выравнивания после завершения ajax запроса. Нужен какой-то callback от вашей пагинации...
Если у вас Joomla, то просто устанавливаете плагин и идете в его настройки.
Если у вас другая CMS, то скачиваете http://brooksite.ru/components/com_jshopping/files/demo_products/Simpleeqh.rar
Подключаете скрипт, прописав в вашем index.php
Код:
<script src="/plugins/system/sex/simpleeqh.js" type="text/javascript"></script>
и в этом же index.php следом пишите
Код:
<script type="text/javascript">
$(window).load(function(){
$(".auto-height").simpleEQH();
});
</script>
объясните подробнее
закидываю файл на сайт в папку /plugins/system/sex/simpleeqh.js
подключаю в index.php прописываю
а это куда ?
$(window).load(function(){
$(".auto-height").simpleEQH();
});
Помогите пожалуйста выровнять
_http://rkmed.net/index.php/jshopping/product-cate gory
В настройках плагина есть поля для указания класса выравниваемых блоков.
Не пойму что куда прописывать после активации плагина
Да есть такая штукенция. Кому интересно, можно по-изучать спецификацию https://www.w3.org/TR/css3-flexbox/
Все уже встроено :)
Цитирую admin:
Действительно, дело оказалось в padding. Просто когда фаербагом правил отступы, то ничего не менялось. А когда в стилях убрал отступы и перезагрузил страницу, то все выровнялось.
Цитирую admin:
Удивительно, работает! Теперь цены нет этому плагину :)
RSS лента комментариев этой записи