Saya mencoba menjalankan item isotop batu 4 kolom di dalam tab/akordeon. Saya menemukan bahwa saya perlu menggunakan layout, untuk membuat isotop bekerja, ketika elemen tab terlihat.

Jadi saya mencoba ini;

jQuery(function ($) {
    $('.tab_title').click(function(){
        $('.iso-container').isotope({
            itemSelector : '.iso-item',
            layoutMode:'masonry',
            masonry:{
                columnWidth: 300
            }       
        });

    });
});

Ketika saya mengklik tab (.tab_title), isotop muncul, tetapi dalam satu kolom, mengambil seluruh lebar wadah. Bagaimana saya bisa memecahkan masalah ini?

Untuk menyebutkan, saya telah mencoba $('.iso-container').isotope('layout') juga. Ini juga menunjukkan satu item mengambil seluruh lebar wadah.

0
тнє Sufi 15 Maret 2020, 21:31

1 menjawab

Jawaban Terbaik

Saya bisa menyelesaikannya menggunakan:

$('.iso-container').isotope( 'reloadItems' ).isotope( { sortBy: 'original-order' } );

Jika seandainya, gambar saling tumpang tindih, gunakan imagesLoaded.

var $grid = $('.iso-container').imagesLoaded( function() {
    $grid.isotope( 'reloadItems' ).isotope({ sortBy: 'original-order' });
});
0
тнє Sufi 5 Mei 2020, 15:39