jquery.isotope

ui-component layout animation

jquery.isotopeは、ユーザー定義の基準に基づいて要素をフィルタリングおよび並び替える機能を提供するjQueryプラグインで、魔法のようなレイアウトを実現します。要素を自動的に整理およびフィルタリングし、レスポンシブウェブデザインに適したインタラクティブな体験を提供します。

Latest Ver 3.0.6

Homepage

Github

11,094

📢 jquery.isotopeは、ウェブページ内の要素を並べ替え、フィルタリングするjQueryプラグインです。

CDNダウンロード

License: GPL-3.0

Asset Type :

すべてのバージョンを見る

https://cdnjs.cloudflare.com/ajax/libs/jquery.isotope/3.0.6/isotope.pkgd.js

https://cdnjs.cloudflare.com/ajax/libs/jquery.isotope/3.0.6/isotope.pkgd.min.js

Sample Code

⚠️ import 文を含む一部のコードは、jsFiddleで正しく実行されない場合があります。エラーが発生した場合は、コードをコピーしてご自身の環境でお試しください。

📄 HTML
<div id='container'>
  <div class='item'>Item 1</div>
  <div class='item'>Item 2</div>
  <div class='item'>Item 3</div>
</div>

🧩 External JS
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.isotope/3.0.6/isotope.pkgd.min.js"></script>

⚙️ JavaScript
$(document).ready(function() {
  $('#container').isotope({
    itemSelector: '.item'
  });
});