Filtre Portfolio à l'ouverture d'une page

[julie1007]

Bonjour les zamis,

 

J'utilise sur un de mes sites un Portfolio !

Je voudrais que lors de l'ouverture de la page, s'affiche seulement les images "cat1" et malheureusement pour l'instant toutes les images s'affichent .......

 

					<div class="portfolio-filter-wrap"><br><br>
                        <ul class="portfolio-filter text-center list-inline">
                            <li class="active"><a href="#" data-filter=".cat1"> 1</a></li>
                            <li><a href="#" data-filter=".cat2"> 2</a></li>
                            <li><a href="#" data-filter=".cat3"> 3</a></li>
                            <li><a href="#" data-filter=".cat4"> 4</a></li>
                            <li><a href="#" data-filter=".cat5"> 5</a></li>
                            <li><a href="#" data-filter=".cat6"> 6</a></li>
                            <li><a href="#" data-filter=".cat7"> 7</a></li>
                        </ul>
                    </div>

<div class="portfolio-grid">
                    
                        <div class="portfolio-item portfolio-item-width-3 cat1">
                            <div class="portfolio-item-content">
                                <img src="img/mr-10.jpg" alt="" class="img-responsive">
                            </div>
                        </div>
                       
                       <div class="portfolio-item portfolio-item-width-3 cat2">
                            <div class="portfolio-item-content">
                                <img src="img/mr-11.jpg" alt="" class="img-responsive">
                            </div>
                        </div>
                        
                        <div class="portfolio-item portfolio-item-width-3 cat3">
                            <div class="portfolio-item-content">
                                <img src="img/mr-12.jpg" alt="" class="img-responsive">
                            </div>
                        </div>
  
  etc ...
</div>

 

Avez-vous une idée pour régler mon problème ;-) ???

Merci

 

JULIE

 

[julie1007]

//mobile meanmenu
    $('.mobile-menu').meanmenu();

    // Portfolio activation
    $('.portfolio-section').imagesLoaded(function() {
        var $grid = $('.portfolio-grid').isotope({
            itemSelector: '.portfolio-item',
            percentPosition: true,
        })

        // Portfolio filtering activation
        $('.portfolio-filter li a').on('click', function() {
            var filterValue = $(this).attr('data-filter');
            $grid.isotope({ filter: filterValue });
        });

        // Filter menu active class addition  
        $('.portfolio-filter li').on('click', function(event) {
            $(this).siblings('.active').removeClass('active');
            $(this).addClass('active');
            event.preventDefault();
        });

        // LOAD MORE BUTTON FOR PORTFOLIO
        $('.load-more-btn').on('click', function(event) {
            $('.portfolio-item').removeClass('hidden');
            var $grid = $('.portfolio-grid').isotope();
            $(this).hide();
            $('#portfolio-section .load-more').append('<a class="button load-more-btn" href="javascript:void(0)">No More Items</a>')
            event.preventDefault();
        });
    });