Isotope фильтрация по хешу

jQuery Isotope остается лучшим сценарием для фильтрации и сортировки элементов в различных макетах, таких как сетки, кладка и адаптивные макеты. Отсутствующей функцией является возможность сортировки этих макетов с помощью URL-хэша, и вы можете заполнить этот пробел следующим фрагментом.

<script>
// Isotope filter by URL Hash 
jQuery(document).ready( function($) {
// Store # parameter and add "." before hash
var hashID = "." + window.location.hash.substring(1);
//  Set Isotope Container
var $container = $('.container');
    $container.isotope({
        itemSelector: ".item",
        filter: hashID, // the variable filter           
});
});
</script>

В нашем примере контейнер изотопов — это «.container», а фильтруемые изотопные элементы обозначаются как «.item». Примером хэша URL, передаваемого изотопу, может быть:

https://site.com/classes#buckinghamshire

В приведенном выше примере клиента классы фильтруются по регионам, когда параметр передается в изотоп через хэш URL. Здесь мы обнаружили, что полезно установить задержку для фильтра изотопов, поскольку необходимо полностью загрузить действующие карты Google, и для этого просто обернуть фильтр URL изотопов в сценарий задержки jQuery.