Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 09.11.2015, 14:45
Новичок на форуме
Отправить личное сообщение для ka3anow Посмотреть профиль Найти все сообщения от ka3anow
 
Регистрация: 09.11.2015
Сообщений: 1

Isotope фильтр
Здравствуйте! Есть тема со встроенным isotope фильтром, который по умолчанию позволяет выбрать один четырех разделов или все сразу.

Вопрос, как сделать несколько фильтров, чтобы можно было выбирать не один а сразу несколько пунктов?

<section class="projects-section projects-page-section">
	<div class="container">
		<div class="title-section alt-title">
			<div class="row">
				<div class="col-md-5">
					<h1>Latest Project</h1>
				</div>
				<div class="col-md-7">
					<ul class="filter">
						<li><a class="active" href="#" data-filter="*">Show All</a></li>
						<li><a href="#" data-filter=".buildings">Buildings</a></li>
						<li><a href="#" data-filter=".interior">Interior</a></li>
						<li><a href="#" data-filter=".energy">Energy</a></li>
						<li><a href="#" data-filter=".isolation">Isolation</a></li>
					</ul>
				</div>
			</div>
		</div>
		<div class="project-box iso-call col3">
			<div class="project-post buildings isolation">
				<img src="upload/projects/1.jpg" alt="">
				<div class="hover-box">
					<div class="inner-hover">
						<h2><a href="single-project.html">Elegant Building</a></h2>
						<span>bulding, house</span>
						<a href="single-project.html" class="link"><i class="fa fa-link"></i></a>
						<a href="upload/projects/1.jpg" class="zoom"><i class="fa fa-arrows-alt"></i></a>
					</div>
				</div>
			</div>
			<div class="project-post interior default-size">
				<img src="upload/projects/3.jpg" alt="">
				<div class="hover-box">
					<div class="inner-hover">
						<h2><a href="single-project.html">Beatiful House</a></h2>
						<span>bulding, house</span>
						<a href="single-project.html" class="link"><i class="fa fa-link"></i></a>
						<a href="upload/projects/3.jpg" class="zoom"><i class="fa fa-arrows-alt"></i></a>
					</div>
				</div>
			</div>
			<div class="project-post interior isolation">
				<img src="upload/projects/5.jpg" alt="">
				<div class="hover-box">
					<div class="inner-hover">
						<h2><a href="single-project.html">Afarist Building</a></h2>
						<span>bulding, house</span>
						<a href="single-project.html" class="link"><i class="fa fa-link"></i></a>
						<a href="upload/projects/5.jpg" class="zoom"><i class="fa fa-arrows-alt"></i></a>
					</div>
				</div>
			</div>
			<div class="project-post energy isolation">
				<img src="upload/projects/7.jpg" alt="">
				<div class="hover-box">
					<div class="inner-hover">
						<h2><a href="single-project.html">traditional Building</a></h2>
						<span>bulding, house</span>
						<a href="single-project.html" class="link"><i class="fa fa-link"></i></a>
						<a href="upload/projects/7.jpg" class="zoom"><i class="fa fa-arrows-alt"></i></a>
					</div>
				</div>
			</div>
			<div class="project-post interior buildings">
				<img src="upload/projects/8.jpg" alt="">
				<div class="hover-box">
					<div class="inner-hover">
						<h2><a href="single-project.html">traditional Building</a></h2>
						<span>bulding, house</span>
						<a href="single-project.html" class="link"><i class="fa fa-link"></i></a>
						<a href="upload/projects/8.jpg" class="zoom"><i class="fa fa-arrows-alt"></i></a>
					</div>
				</div>
			</div>
			<div class="project-post energy isolation buildings">
				<img src="upload/projects/10.jpg" alt="">
				<div class="hover-box">
					<div class="inner-hover">
						<h2><a href="single-project.html">traditional Building</a></h2>
						<span>bulding, house</span>
						<a href="single-project.html" class="link"><i class="fa fa-link"></i></a>
						<a href="upload/projects/10.jpg" class="zoom"><i class="fa fa-arrows-alt"></i></a>
					</div>
				</div>
			</div>
			<div class="project-post buildings isolation">
				<img src="upload/projects/2.jpg" alt="">
				<div class="hover-box">
					<div class="inner-hover">
						<h2><a href="single-project.html">Elegant Building</a></h2>
						<span>bulding, house</span>
						<a href="single-project.html" class="link"><i class="fa fa-link"></i></a>
						<a href="upload/projects/2.jpg" class="zoom"><i class="fa fa-arrows-alt"></i></a>
					</div>
				</div>
			</div>
			<div class="project-post interior">
				<img src="upload/projects/4.jpg" alt="">
				<div class="hover-box">
					<div class="inner-hover">
						<h2><a href="single-project.html">Beatiful House</a></h2>
						<span>bulding, house</span>
						<a href="single-project.html" class="link"><i class="fa fa-link"></i></a>
						<a href="upload/projects/4.jpg" class="zoom"><i class="fa fa-arrows-alt"></i></a>
					</div>
				</div>
			</div>
			<div class="project-post interior isolation">
				<img src="upload/projects/6.jpg" alt="">
				<div class="hover-box">
					<div class="inner-hover">
						<h2><a href="single-project.html">Afarist Building</a></h2>
						<span>bulding, house</span>
						<a href="single-project.html" class="link"><i class="fa fa-link"></i></a>
						<a href="upload/projects/6.jpg" class="zoom"><i class="fa fa-arrows-alt"></i></a>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Фильтр на странице Baton1777 Общие вопросы Javascript 3 07.07.2015 16:38
фильтр java. Сортировка kirik1982 Общие вопросы Javascript 2 26.03.2015 18:50
Фильтр по начальным символам Shasoft Angular.js 9 22.03.2015 09:25
ng-repeat кастомный фильтр для фильтрации обьектов (непонятное поведение) VerDiz Angular.js 10 04.08.2013 15:42
Фильтр каталога Nivans Элементы интерфейса 4 15.07.2012 15:27