Доброго времени суток =)
Столкнулся с такой проблемой, пишу одностраничный сайт пытаюсь сделать небольшую галерею с поп окнами
Проблема такая: Картинки не отображаются, просто белые окна, не пойму с чем напортачил, собственно сама задумка что бы там была сортировка картинок по фильтрам.
Там где белое грузится, это какая то бесконечная загрузка, не пойму почему картинки не прогружает, хотя путь указан, все верно.
Я еще зелёный по этому не догоняю что натворил)
и как исправить?
Вот код:
Столкнулся с такой проблемой, пишу одностраничный сайт пытаюсь сделать небольшую галерею с поп окнами
Проблема такая: Картинки не отображаются, просто белые окна, не пойму с чем напортачил, собственно сама задумка что бы там была сортировка картинок по фильтрам.
Там где белое грузится, это какая то бесконечная загрузка, не пойму почему картинки не прогружает, хотя путь указан, все верно.
Я еще зелёный по этому не догоняю что натворил)
и как исправить?
Вот код:
Код:
<div class="gallery">
<div class="container">
<ul id="filters" class="clearfix">
<li><span class="filter" data-filter="app web">Веб дизайн</span></li>
<li><span class="filter" data-filter="icon web card">Логотипы</span></li>
<li><span class="filter" data-filter="web app icon card">Принты</span></li>
<li><span class="filter active" data-filter="app card icon logo web">Всё</span></li>
</ul>
<div id="portfoliolist" style="">
<div class="portfolio logo1 mix_all" data-cat="logo" style="display: inline-block; opacity: 1;">
<div class="portfolio-wrapper">
<a class="popup-with-zoom-anim zoom pink" href="#small-dialog1">
<img src="images/p1.з" alt="Image 1" style="top: 0px;">
</a>
</div>
</div>
<div class="portfolio web mix_all" data-cat="app" style="display: inline-block; opacity: 1;">
<div class="portfolio-wrapper">
<a class="popup-with-zoom-anim zoom pink" href="#small-dialog1">
<img src="images/p2.jpg" alt="Image 2" style="top: 0px;">
</a>
</div>
</div>
<div class="portfolio web mix_all" data-cat="web" style="display: inline-block; opacity: 1;">
<div class="portfolio-wrapper">
<a class="popup-with-zoom-anim zoom pink" href="#small-dialog1">
<img src="images/p3.jpg" alt="Image 3" style="top: 0px;">
</a>
</div>
</div>
<div class="portfolio card mix_all" data-cat="card" style="display: inline-block; opacity: 1;">
<div class="portfolio-wrapper">
<a class="popup-with-zoom-anim zoom pink" href="#small-dialog1">
<img src="images/p4.jpg" alt="Image 4" style="top: 0px;">
</a>
</div>
</div>
<div class="portfolio app mix_all" data-cat="app" style="display: inline-block; opacity: 1;">
<div class="portfolio-wrapper">
<a class="popup-with-zoom-anim zoom pink" href="#small-dialog1">
<img src="images/p5.jpg" alt="Image 5" style="top: 0px;">
</a>
</div>
</div>
<div class="portfolio card mix_all" data-cat="card" style="display: inline-block; opacity: 1;">
<div class="portfolio-wrapper">
<a class="popup-with-zoom-anim zoom pink" href="#small-dialog1">
<img src="images/p6.jpg" alt="Image 6" style="top: 0px;">
</a>
</div>
</div>
<div class="portfolio app mix_all" data-cat="app" style="display: inline-block; opacity: 1;">
<div class="portfolio-wrapper">
<a class="popup-with-zoom-anim zoom pink" href="#small-dialog1">
<img src="images/p7.jpg" alt="Image 7" style="top: 0px;">
</a>
</div>
</div>
<div class="portfolio card mix_all" data-cat="card" style="display: inline-block; opacity: 1;">
<div class="portfolio-wrapper">
<a class="popup-with-zoom-anim zoom pink" href="#small-dialog1">
<img src="images/p8.jpg" alt="Image 8" style="top: 0px;">
</a>
</div>
</div>
</div>
</div><!-- container -->