Делим материалы в контейнере div на две колонки
DownLoad_Free

Делим материалы в контейнере div на две колонки

Главная » Материалы » Web, scripts


...
ТиЦ

Делим материалы в контейнере div на две колонки

[ ] 03.08.2014

Представляем скрипт, который автоматически делит(распределяет) различные(в том числе и по высоте) материалы, заключенные в блоки 'item' на 2 одинаковые колонки

Соль скрипта заключается в выполнении следующей функции
var LeftH = 0;
var RightH = 0;
$(".text_list .item").each(function(){
var h = this.offsetHeight;
if (RightH < LeftH){
RightH += h;
$(this).addClass("itemRight");
} else {
LeftH += h;
}
});
которая подставляет определенным блокам особый класс

Кроме того надо прописать определенные CCS правила, чтобы все работало правильно и был соответствующий дизайн.

Кроме этого в примере можно почерпнуть еще один полезный скрипт, который при клике по кнопкам социальных сетей, отправляет нас куда следует.

$(document).on("click", ".socialBoxShare", function(event){
if ($(event.target).is(".fb")){
location.href="";
return false;
} else if ($(event.target).is(".vk")) {
location.href="";
return false;
} else if ($(event.target).is(".tw")){
location.href="";
}
});

В этот блок для примера мы поместим картинку

Весь код данного материала приведен ниже.

Источник: kinopoisk.ru

Исходный код скрипта



Теги материала: div, Columns, колонки
Похожие материалы:
Категория: Все | Добавил: anikey99
Просмотров: 794 | Загрузок: 0
Полезные дополнения:

Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]
Нашли ошибку или
Быстрая форма обратной связи -
жмите Ctr+Enter Система Orphus
Рекомендуем:



Случайные материалы


Copyright kachay.ucoz.org © 2008-2016 | Хостинг от uCoz | wright2webmaster | Рейтинг@Mail.ru
 
^ Наверх ^
Полезно!

Код кнопки