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.
p.s. Если статья была полезной и вас переполняет чувство благодарности, можете поддержать меня долларом на патреоне
