問題タブ [jquery-isotope]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
5531 参照

javascript - 同位体コールバック関数

Isotope には、コールバック関数を指定できる場所が 2 つあります。

これら2つの違いが何であるかはわかりません.レイアウトが完了した後、どちらも1回だけ呼び出されるようです. 私はドキュメントを調べましたが、見つけることができるのは

コールバックに似た onLayout は、Isotope インスタンスがそのレイアウト ロジックを実行するたびにトリガーされる関数です。

0 投票する
3 に答える
1808 参照

jquery - jQueryセレクターを使用してjQuery同位体アイテムを大文字と小文字を区別せずにフィルタリングする方法(検索)

私はjQueryIsotopeで遊んでいて要素検索を実装したいと思っています。ユーザーがテキストボックスに入力すると、次のようにフィルターオプションを変更します。

jQueryの属性にselectorが含まれていますただし、大文字と小文字が区別されるため、大文字と小文字を区別したいと思います。どうすればこれを達成できますか?

を使用することを提案する他の質問とGoogleの結果を見てきましたが.filter(fn)、同位体ではそれほど制御できません。私はそれにセレクターを与えるだけです。

0 投票する
1 に答える
6431 参照

jquery - jQuery 同位体アニメーションの遅延

「transition-delay: 0s, 1s;」のようなものを使用してアイテムのシャッフル方法に遅延を追加するために、jquery Isotope で使用される CSS3 トランジションを変更できた人がいることに興味があります。

フィルタリングするときに、(デフォルトの「斜めシャッフル」ではなく) より数学的なタイプの感覚を得るために、最初に左にシャッフルしてから下にシャッフルしてほしいと思います。デフォルトの css3 トランジションに加えられた変更は機能しないようです。

これが私の現在のcssです:

どんな入力でも素晴らしいでしょう!

0 投票する
2 に答える
519 参照

jquery - 幅/溝を変更しますか?

3 つのアイテムの行を持つサムネイル ギャラリーを作成しようとしていますが、アイテムの幅 (192px) または余白 (10px) を制御できません。私のコードはこちら

0 投票する
1 に答える
1984 参照

jquery - ISOTOPE: カテゴリと日付で並べ替え

私はISOTOPEを使用しており、6 つのカテゴリがあります。各カテゴリには任意の数の投稿があります。

カテゴリ名 (アーティストなど) をクリックすると、各カテゴリへのリンクのリストが表示されます。そのアーティスト カテゴリ内のすべてのボックスを一番上に移動し、日付順に並べて、最新のボックスが最初に表示されるようにする必要があります。

私のJSファイルにはこれがあります:

私のHTMLは次のようになります。

このコードは、私が望むようにソートされていないようで、それを適応させる方法の手がかりがありません.誰かが助けてくれますか?

0 投票する
1 に答える
2144 参照

jquery - XML および jQuery で読み込まれたオブジェクトで Isotope を使用します。これは可能ですか?

XML と jQuery を使用して読み込み、Isotope に接続しようとしているオブジェクトがありますが、それはうまくいかないようです。これは可能ですか?さまざまなソリューションを試しましたが、うまくいくソリューションが見つからないようです。これは私が持っているものです。同位体でコールバック関数を試しましたが、まだ運がありません..XMLを使用してクラスで呼び出していますが、結果はfirebugで次のようになります: item yellow, item red , item blueなど.

0 投票する
2 に答える
2931 参照

jquery - 同位体-要素の並べ替え。最初にこれで、次にそれで

これが私がこれまでに取り組んできたものに対するJSFiddleです:http://jsfiddle.net/FmBFt/1/の問題は、私が望むことをするためにデモコードを適応させることです。Isotopeのドキュメントは、私のようなnoobコーダーにはあまり役立ちません。

私が必要なものを説明するために

私はISOTOPEを使用しており、6つのカテゴリがあります。各カテゴリには、任意の数のボックスが含まれます。したがって、ライラックカテゴリには3つのボックスがあり、グリーンカテゴリには8つのボックスがあります。各カテゴリへのリンクのリストがあります。カテゴリ名をクリックすると(例:ライラックカテゴリ)、ライラックの上部の境界線が付いたすべてのボックスをクラス名「l」で並べ替えて、上部に移動する必要があります。次に、これらのライラックボックスを、追加された日付の順に並べ替えて、最新のボックスが最初に表示されるようにします。その並べ替え機能をすべてのカテゴリに適用したいのですが、実際にはその方法がわかりません。

「date-category」で並べ替えることができることに気づきましたが、すべてのカテゴリをグループ化するだけで、必要なように特定のカテゴリを一番上に移動することはできません。

http://jsfiddle.net/FmBFt/1/を自分のやりたいことをするように適応させる方法がわかりません。誰か助けてもらえますか?

編集:これまでのところ、私を混乱させた答えが1つありますが、私の問題はJS内のgetSortData関数にあると確信しています。

上記のコードのカテゴリ呼び出しはそれができるように見えますが、調整する方法を見つける必要があります。現時点では、すべてのカテゴリをグループ化するだけですが、一度に1つずつグループ化する必要があります...誰か?

0 投票する
2 に答える
1487 参照

jquery - 同位体の問題: 組積造の柱の幅がコードで定義された値の 2 倍

これは非常に奇妙で、私がウェブで徹底的に調査しました。解決策が見つかりませんでした。

jQuery は次のように述べています。

$container.isotope({ itemSelector : '.post', masonry: { columnWidth: 250, }
});

.post のスタイルは次のように述べています。

.post { 幅:250px; }

Isotope が .post の位置を定義する場合、2 番目の列はページの左から 500 ピクセルに配置されます。3 列目、ページの左から 1000 ピクセル。各列の幅が 500px になっているようです。

リンクは: http://asimob.tv

これでハゲて高血圧になる。私は本当に、本当に助けていただければ幸いです。お願いします!

0 投票する
0 に答える
496 参照

jquery-isotope - アイソトープ-隠し要素の挿入バグ

Isotope 1.5.14を使用しており、カテゴリ別のフィルターを使用してコンテンツを挿入しようとしています。

挿入する要素がカテゴリXのものであり、私の要素がXでフィルタリングされている場合、これは完全に正常に機能します。

しかし、カテゴリXの要素を挿入しようとして、要素がYでフィルタリングされている場合、挿入関数のコールバックは機能しません。

要素は適切に挿入されていますが、もう一度Xでフィルタリングすると、要素が表示されます。

$newFilteredAtoms アイソトープをデバッグしようとした後、追加しているアイテムがカテゴリYに属していないため、アイソトープが空のを取得すると問題が発生すると思います。

この空の配列は、引数としてに転送されます

それは

そして、次のコードは、コールバックが実行される前に関数を終了します。

なぜですか?これは非常に便利です。

ありがとう!

0 投票する
1 に答える
1334 参照

javascript - 同位体: .xx クラスを選択して上部に表示

Isotope (http://isotope.metafizzy.co/docs/sorting.html) 内の並べ替え方法を使用しており、リンクがクリックされたときに特定の CSS クラス名が割り当てられた要素を上部に表示する必要があります。残りの要素は、並べ替えられた要素の下に表示されたままにする必要があるため、Isotope フィルタリングを使用できません。

私はJS/jQueryにあまり慣れていないので、このコードが正しく設定されているかどうかさえわかりませんが、現在、私の要素は日付でソートされていますが、すべての要素に対してこれを行っています. クラス名が「blogs」のすべての要素をコードで検索し、日付順に並べ替えたいと思います。これまでの私のコードは次のとおりです。