Как удалить «ВСЕ» и показать определенную категорию в качестве файла по умолчанию? - PullRequest
0 голосов
/ 24 апреля 2019

Я хочу удалить кнопку «все» и установить фильтр «аудиокниги» по умолчанию, когда пользователь посещает веб-сайт.У меня там будет только 2 кнопки Audio Book и Text Images.Я использую Bootstrap 4.

Это то же самое, что я ищу.Но когда я обновляю сайт, это как мигание, тогда через 1-2 секунды исчезает другая категория. Удалите кнопку «все» в фильтре портфолио и автоматически отобразите конкретную кнопку фильтра в JavaScript

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

Я надеюсь, что кто-то может помочь мне.Спасибо!

<div class="editorial">
  <div class="container">
    <div class="portfolio-menu mt-2 mb-4">
      <ul>
        <li class="btn btn-outline-dark active" data-filter="*">All</li>
        <li class="btn btn-outline-dark" data-filter=".TI">Text & Images</li>
        <li class="btn btn-outline-dark" data-filter=".AB">Audiobook</li>
      </ul>
    </div>
    <div class="portfolio-item row">
      <div class="item TI col-5">
        <a href="././assets/images/FS_editorial_top1.jpg" class="fancylight popup-btn" data-fancybox-group="light">
          <img class="img-fluid" src="././assets/images/FS_editorial_top1.jpg" alt="">
        </a>
      </div>
      <div class="item TI col-5">
        <a href="././assets/images/FS_editorial_top2.jpg" class="fancylight popup-btn" data-fancybox-group="light">
          <img class="img-fluid" src="././assets/images/FS_editorial_top2.jpg" alt="">
        </a>
      </div>
      <div class="item AB col-5">
        <a href="././assets/images/FS_editorial_top3.jpg" class="fancylight popup-btn" data-fancybox-group="light">
          <img class="img-fluid" src="././assets/images/FS_editorial_top3.jpg" alt="">
        </a>
      </div>
      <div class="item AB col-5">
        <a href="././assets/images/FS_editorial_top4.jpg" class="fancylight popup-btn" data-fancybox-group="light">
          <img class="img-fluid" src="././assets/images/FS_editorial_top4.jpg" alt="">
        </a>
      </div>
      <div class="item AB col-5">
        <a href="././assets/images/FS_editorial_top5.jpg" class="fancylight popup-btn" data-fancybox-group="light">
          <img class="img-fluid" src="././assets/images/FS_editorial_top5.jpg" alt="">
        </a>
      </div>
      <div class="item AB col-5">
        <a href="././assets/images/FS_editorial_top6.jpg" class="fancylight popup-btn" data-fancybox-group="light">
          <img class="img-fluid" src="././assets/images/FS_editorial_top6.jpg" alt="">
        </a>
      </div>
      <div class="item AB col-5">
        <a href="././assets/images/FS_editorial_top7.jpg" class="fancylight popup-btn" data-fancybox-group="light">
          <img class="img-fluid" src="././assets/images/FS_editorial_top7.jpg" alt="">
        </a>
      </div>
      <div class="item TI col-5">
        <a href="././assets/images/FS_editorial_top8.jpg" class="fancylight popup-btn" data-fancybox-group="light">
          <img class="img-fluid" src="././assets/images/FS_editorial_top8.jpg" alt="">
        </a>
      </div>
      <div class="item TI col-5">
        <a href="././assets/images/FS_editorial_top9.jpg" class="fancylight popup-btn" data-fancybox-group="light">
          <img class="img-fluid" src="././assets/images/FS_editorial_top9.jpg" alt="">
        </a>
      </div>
      <div class="item TI col-5">
        <a href="././assets/images/FS_editorial_top10.jpg" class="fancylight popup-btn" data-fancybox-group="light">
          <img class="img-fluid" src="././assets/images/FS_editorial_top10.jpg" alt="">
        </a>
      </div>
    </div>
  </div>
</div>
  <script type="text/javascript">
            $('.portfolio-item').isotope({
          itemSelector: '.item',
          layoutMode: 'fitRows'
         });
         $('.portfolio-menu ul li').click(function(){
          $('.portfolio-menu ul li').removeClass('active');
          $(this).addClass('active');

          var selector = $(this).attr('data-filter');
          $('.portfolio-item').isotope({
            filter:selector
          });
          return  false;
         });
         $(document).ready(function() {
         var popup_btn = $('.popup-btn');
         popup_btn.magnificPopup({
         type : 'image',
         gallery : {
          enabled : true
         }
         });
         });
  </script>
...