ВОПРОС "Мини галерея"

Killafromtequila

Автор темы
Сообщения
1
Репутация
0
Баллы
1
Доброго времени суток =)
Столкнулся с такой проблемой, пишу одностраничный сайт пытаюсь сделать небольшую галерею с поп окнами
Проблема такая: Картинки не отображаются, просто белые окна, не пойму с чем напортачил, собственно сама задумка что бы там была сортировка картинок по фильтрам.
331

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


Я еще зелёный по этому не догоняю что натворил)
и как исправить?


Вот код:
Код:
<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 -->
 
Сообщения
1
Репутация
0
Баллы
1
Покажите исходники полностью. По HTML одному решить проблему не получиться, разве что сделать предложения:
  1. Все таки неверно указаны пути до картинок.
  2. Неправильно подключен скрипт для галереи.
  3. Проверьте JS, возможно вы не указали класс, где лежат ваши картинки.
Чтобы проверить каждый каждый пункт — посмотрите консоль разработчика (F12 в Chrome) на наличие ошибок.