問題タブ [jquery-masonry]

ドロップダウンメニュー内でjquery組積造を使用して、動的メニュー項目ブロック（画像とテキスト）を複雑なドロップダウンメニューに整理したいと思います。

いくつか問題があります。

まず、display：noneから始めると、石積みは位置の計算を行いません。ドロップダウンメニューで石積みを使用しているため、ドロップダウンが表示された状態でページを開くことができません。

次に、メニューコンテナはposition：absoluteである必要があります。これにより、ドロップダウンが次のページの上に開き、メニューの下のテキストが押されないようになります。組積造はページの残りの部分を押し下げます。

第3に、IE 8および9（まだ7を試していません）では、ドロップダウンを非表示にして表示すると、アイテムのブロックが整理されていない状態で始まり、すぐに整理された石積みのレイアウトに切り替わります。それは私が理解しておらず、取り除くことができないことを示すすべての非表示と表示のフラッシュです。

ドロップダウンメニュー内でjquery組積造をうまく使用した人はいますか？

ありがとう

コードのクリックイベントに関数を追加しようとしています。ちなみに、これはかなりクールなjQueryツールであるIsotope.jsを使用するためのものです。

したがって、以下のコードは次のように機能します<ul>。火災同位体のデータフィルターリンクをクリックします。<li>これにより、data-filterパラメーターに一致するさまざまなデータがページに表示されます。すべて良い。

しかし、1つのサイズを変更する追加のコードがある<li>ので、任意のクリックで次を起動するためにアイソトープが必要です<li>-アイソトープは石積みを使用する動的なページレイアウトツールです。

これにより、レイアウトプロパティがリセットされ、すべてのアイテム要素がレイアウトされます。参照-isotope.jsリレーアウト

<li>がクリックされたときにリレーアウト関数をトリガーするスクリプト用の別のコードが必要だと思います。

これは私が持っているものです...

ページの読み込み時に関数を実行しようとしていますが、機能していません。考えられるすべての場所に追加しましたが、機能するのは次のとおりです。

私は遅延を試みましたが、上記のハッキーな方法に頼りました:(

私の関数が実行されない理由について誰か提案がありますか?

アップデート：

私はjqueryに石積みを使用しています。私の問題は、ajax で組積造を使用するページを読み込むと、それらが 1 つの列に表示されることです。適切にリセットしますが、上記の方法$('#project_thumbs_container').masonry('reload');を使用した場合にのみ機能します。mousemove

ポートフォリオアイテムに石積みを使用しています。ページに直接移動すると、適切な列にタイルが読み込まれます。ただし、私の Web サイトは pjax を使用して読み込まれます。ポートフォリオ ページを読み込むと、ウィンドウのサイズを変更するまで、すべてのポートフォリオ アイテムが 1 つの列に読み込まれます。

そのような石積みは、ajax 要求の後にクライアントの幅を認識せず、ウィンドウのサイズが変更されたときにクライアントから飛び出します。

私が経験していることを知っている石積みの経験がある人はいますか?

親要素のクラスを削除しようとして、このJavaScriptを取得しました:

このhtmlで：

残念ながら、これは今のところうまくいきません。次のようないくつかのテストを行いました。

と

それはすべて動作します。wordpressサイトでjQuery 1.6.2とjQuery masonryを使用しています。ここにライブデモがあり、すべてが機能している (機能していない) ことを確認できます。基本的には機能しますが、クラスが から削除されていないという事実により、とそのコンテンツがすぐに再開されます。クラスを削除しない理由についてかなり混乱しています。divdiv.expanded

編集:ドキュメントがロードされたときにクラスがまだ存在することを理解しました。写真をクリックすると後で追加されるので、削除の問題はこれからだと思います。誤解を招く説明で申し訳ありません。

これはこれと同じ質問ですが、ここに JSFiddle に関する問題の再現があります。ということで、再投稿しようと思いました。

JQuery Masonry は、最初の実行時にコンテナーの子を 1 回だけ評価するようです。その後、DOM を再度調べて、その子を再評価させることはできません。

タイトルはほとんどすべてを物語っています。石工の画像プラグインを調べましたが、運がありませんでした。誰か助けてもらえないでしょうか?

スクリプトは多くのことを行います。フィルター ビット、アニメーション、表示/非表示、コンテンツを取得するための ajax などがあります。重なっている理由と、以下のコード:

だから私は、jQuery Masonry グリッドの現在の幅にサイズ変更するヘッダーを作成しようとしています。

私の実際の例はここにあります: http://jsfiddle.net/hGnLH/

私はこのサイトに同様の影響を与えようとしています: http://citizenmag.citizenm.com/ (私は、ヘッダーを Masonry グリッドと同じ幅にし、ユーザーがブラウザーの幅を変更したときにサイズを変更したい)

どんな助け/提案も大歓迎です。

jQuery Masonryの壁を疑似流体レイアウトのヘッダーのすぐ上のヘッダーと同じ幅にしようとしています。http://blart-philip.comを参照

方法が見つかりません。

私の CSS コードwidth: 51em;は、要素レベルで masonry JS によってオーバーライドされ、常にarticle#contentコンテナーに対して相対的になります。

何ができるでしょうか？

これが私のJSコードです：

助言がありますか？

ありがとう

パット

私は、David DeSandro による素晴らしい Isotope プラグインを利用するフォトブログを作成中ですが、現在、プラグインをレスポンシブ/流動グリッド内で意図したとおりに機能させるのに苦労しています。

www.lewismalpas.co.uk/tumblr (デモ)

各画像は、25% の明示的な幅を持つ div (.item) 内にラップされます。画像は柔軟であるため、理論的には 4 つの画像をインラインで表示できるはずですが、現時点では 2 つしか表示されていないようです。問題を理解するために。