Leichte Alternative zu isotope.js

7

Ich benutze isotope.js nur wegen seiner Animationen zum Hinzufügen / Entfernen von Elementen.

Ich liebe den Effekt von Elementen, die animieren, die Position entfernter Elemente gleichzeitig zu füllen, wenn die entfernten Elemente ausgeblendet werden.

Die Sache ist, meine Rasterelemente sind alle von einer festen und gleichen Größe, und ich brauche keine der Filterkram. Ich finde das Isotop etwas klobig, vielleicht wegen der Breite seiner Funktionalität.

Ich suche also nach einer Alternative, die ist:

  • leichtgewichtig
  • slick
  • robust und produktionsbereit
  • kann
  • fälschlicherweise degradieren
eye_mew 07.01.2015, 15:10
quelle

5 Antworten

19

Wenn noch jemand nach Ihnen sucht, sollten Sie sich vielleicht auch ein ähnliches jQuery-Plugin ansehen, das ich geschrieben habe, Filterizr . Filterizr ist:

  • Ermöglicht Filterung , Sortierung , shuffling und Suche
  • In hohem Maße anpassbar (ermöglicht Benutzern das Schreiben eigener CSS-Effekte für die Übergänge beim Ein- und Ausfiltern)
  • Verwendet CSS3-Übergänge und transform-translate .
  • Leichtgewicht, ~ 20kb
  • Optimiert für mobile Leistung
  • Responsive (mit Ihren Medienanfragen)
  • Open Source und MIT lizensiert

Download Links, Tutorials und Dokumente auf der   Filterizr-Website

    
giotiskl 07.03.2016 12:24
quelle
5

Falls jemand noch schaut, check out Shuffle.js . Es reagiert mit MIT-Lizenz.

    
Maverick 09.11.2015 16:48
quelle
4

Scheint so, als ob Sie nach jQuery Masonry suchen.

Im Allgemeinen ist Isotope für die meisten Fälle ziemlich glatt, alles abhängig von der Menge an Inhalten, die Sie natürlich darauf werfen.

Der Grund für die Ungeschicklichkeit könnte jQuery selbst sein. Während jQuery ein erstaunlicher Selektor ist, mangelt es der Animation und der Geschwindigkeit der Manipulation aufgrund der schiere Menge an Funktionalität, die in der lib enthalten ist.

    
cowcowmoomoo 09.01.2015 14:50
quelle
2

ich benutze jquery Quicksand, das ist ziemlich ordentlich und direkt Ссылка

    
Adal arasu 17.03.2015 06:10
quelle
1

Es gibt eine einfache, leichte Alternative zum Isotop codepen

nur ein paar Schritte zum Einrichten

  1. Navigationselemente haben .filter class und data-target , die Elemente anzeigen, deren data-category -Wert dem Wert entspricht.
  2. Rasterelemente haben .item class und data-category akzeptiert mehrere Werte.

Um den Abstand zwischen den Elementen zu ändern, ändern Sie item-inner width.

Um die Animation zu ändern, ändern Sie transform in JavaScript unter animation fadein / fadeout comment.

    
user6213434 11.12.2016 20:39
quelle

Tags und Links