Конфликт с использованием изотопной фильтрации и Unite Image Gallery на одной странице? - PullRequest
Новая
       54

Конфликт с использованием изотопной фильтрации и Unite Image Gallery на одной странице?

0 голосов
/ 24 марта 2019

Я пытаюсь одновременно использовать галерею Unite Image Gallery и фильтрацию изотопов в галерее.У меня изотоп работает нормально сам, а галерея изображений Unite работает сама.Когда я соединяю их, я не могу отфильтровать изображения, так как Unite Galley использует Display: none.Есть ли способ, что они оба могут сосуществовать в одной галерее?

Они работают сами по себе, но не вместе.Вот вилка, но я не уверен, что сделал это правильно.https://codepen.io/soundtec24/pen/zbedQE 

````````
<section id="picture-gallery" class="container-XL pad-100-bottom" style="padding-top:128px;">

            <header class="container section-header">
          <h1>Pictures</h1>
        </header>
    <div class="container text-center pad-50-bottom">
    <i class="fas fa-hand-pointer"></i>
    <p>Click on any image below to launch a full screen slide show of the individual pictures.</p></div>

     <section id="galleryfilter"  class="section">
        <div class="row">
          <div class="col-lg-12">
            <ul id="gallery-flters">
              <li data-filter="*" class="filter-active">All</li>
              <li data-filter=".1">Scenery</li>
              <li data-filter=".2">Costumes</li>
              <li data-filter=".3">Props</li>
                <li data-filter=".4">Projections</li>
            </ul>
          </div>
        </div>

    <div id="galler" class="gallery-container" style="display:non"> 


        <a href="http://unitegallery.net" class="1 2 3 gallery-item">
        <img alt="Lemon Slice!!!!!!!!!!!!!!!!!!"
             src="img/gallery/sets/thumb/1.jpg"
             data-image="img/gallery/sets/1.jpg"
             data-description="This is a Lemon Slice"
            style="display:non">
        </a>
    </div>
    </section>
    </section>
``````````

'''''''''
Javascript

  var otherrentalsIsotope = $('.other-rentals-container').isotope({
    itemSelector: '.rental-item',
    layoutMode: 'fitRows'
  });

  $('#rental-flters li').on( 'click', function() {
    $("#rental-flters li").removeClass('filter-active');
    $(this).addClass('filter-active');

    otherrentalsIsotope.isotope({ filter: $(this).data('filter') });
  });



  var galleryfilterIsotope = $('.gallery-container').isotope({
    itemSelector: '.gallery-item',
    layoutMode: 'fitRows'
  });

  $('#gallery-flters li').on( 'click', function() {
    $("#gallery-flters li").removeClass('filter-active');
    $(this).addClass('filter-active');

    galleryfilterIsotope.isotope({ filter: $(this).data('filter') });
  });
````````

Я бы ожидал, что смогу фильтровать изображения, используя как галерею Unite, так и фильтры изотопов

...