Здравствуйте. Есть код в html:
<div id="filters" class="gallery-filter">
<select>
<option value="*">All</option>
<option value=".logo">Логотипы</option>
<option value=".firm">Фирменные стили</option>
<option value=".anim">Анимация логотипов</option>
</select>
</div>
<div id="gallery-items">
<div class="gallery-item gallery-popup all logo">
<a href="images/01.jpg"><img src="images/01.jpg" alt="gallery-image" class="img-responsive" /></a>
</div>
<div class="gallery-item gallery-popup all logo">
<a href="images/02.jpg"><img src="images/02.jpg" alt="gallery-image" class="img-responsive" /></a>
</div>
<div class="gallery-item gallery-popup all firm">
<a href="images/03.jpg"><img src="images/03.jpg" alt="gallery-image" class="img-responsive" /></a>
</div>
</div>
и код в JS:
$(window).load(function(){
var $container = $('#gallery-items'),
$select = $('#filters select');
$container.isotope({
itemSelector: '.gallery-item'
});
$select.change(function() {
var filters = $(this).val();
;
$container.isotope({
filter: filters
});
});
})
Фильтр работает, но проблема в том, что при открытии страницы отображаются ВСЕ слои, и никак не удается добиться того, чтобы изначально видны были только элементы, к примеру, со значением ".logo".
Если в filter: filters вместо "filters" подставить "$('.logo'), то отображаются только логотипы, но select.change отказывается работать.
Подскажите, пожалуйста, как сделать активным по-умолчанию содержание пункта "Логотипы". Решение где-то на поверхности, но разобраться в jquery никак не получается
