jQuery Изотопный глюк - PullRequest
Новая
       9

jQuery Изотопный глюк

0 голосов
/ 30 января 2019

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

Мой jQuery: 

// init Isotope
  var $grid = $('.grid').isotope({
    itemSelector: '.grid-item',
    percentPosition: true,
    masonry: {
      columnWidth: '.grid-sizer'
    }
  });

  // Make filtering work
  $('.filter-button-group').on( 'click', 'button', function() {
    var filterValue = $(this).attr('data-filter');
    $grid.isotope({ filter: filterValue });
  });

  // layout Isotope after each image loads
  $grid.imagesLoaded().progress( function() {
    $grid.isotope('layout');
  });

  // Highlight the active filter
  $('.button-group').each( function( i, buttonGroup ) {
  var $buttonGroup = $( buttonGroup );

  $buttonGroup.on( 'click', 'button', function() {
    $buttonGroup.find('.is-checked').removeClass('is-checked');
    $(this).addClass('is-checked');
  });
});

, а живую демонстрацию можно найти здесь: http://dominikwierl.com/develop/v+v/projects

1 Ответ

0 голосов
/ 30 января 2019

Это можно закрыть.

Я нашел ответ с еще немного поиска.Это называется изотопным встряхиванием, и это может произойти, если на одном объекте слишком много анимации.

См .: https://isotope.metafizzy.co/faq.html#items-jump-after-transitioning-position

...