問題タブ [jquery-isotope]

これに対する答えを見つけようとしましたが、おそらく非常に簡単です。選択したクラスをアイソトープのアクティブ フィルターに追加したいと考えています。これが私のコードです：

私のhtmlは：

誰でも助けてください。ありがとうデイブ

Div間で10pxのガター幅を取得しようとしていますが、適用されていないようです。アイテムがシャッフルされ、フィルタリングナビゲーションも機能するため、Isotopeスクリプトが機能しています。

このガターを手に入れるのに苦労しています！:(

コードは次のとおりです。

そして、これが私のHTMLです。

Instagramクエリ プラグインを使用して写真をページに読み込み、Jquery Isotopeを使用してレイアウトを行うコードに取り組んでいます。そのハッシュ名でタグ付けされた画像をロードするテキスト入力にハッシュ名を入力する機能が必要であることを除いて、私はそれを機能させています。画像をロードするボタンがあります。テキスト入力を初めて入力したときはうまく機能しますが、テキスト入力が変更されたときにボタンクリック機能でハッシュを更新できません。これにデリゲートを使用する必要があるかどうか疑問に思っていますか? 私は初心者のjqueryコーダーなので、コードを微調整する必要があることに気づきました。

プロジェクトにアイソトープを使用しています。商用ライセンスを購入しました。

大きなレイアウト内で動作するように、固定サイズのコンテナー (高さが特に重要) にアイソトープ タイルを配置する必要があります。

コンテナにCSSの高さを設定してみました：

ただし、これにより、スクロールできないコンテナーが作成されます。私は何が欠けていますか？

同位体を使用して滑らかなグリッド ギャラリーを構築しています。現在、追加機能に問題があります: http://isotope.metafizzy.co/docs/methods.html#appended

このように追加を呼び出すと

その後、同位体は次のエラー メッセージを吐き出します。

div に配置を追加すると、新しい要素がその位置に読み込まれ、固定されたままになることを除いて、正常に動作します。

jquery Isotope を使用してポートフォリオ ギャラリーを作成しています。ほとんどすべてが期待どおりに機能しています。変更したいのは、開いているコンテンツの動作だけです。写真をクリックすると、コンテンツ ボックスが展開され、テキスト付きの大きな画像が表示されます。問題は、コンテンツ ボックス (.item) をもう一度クリックすると、コンテンツが元のサイズに戻ることです。これは、ボックスの一部にカラーボックス付きの複数の画像が含まれているためです。

最善の解決策は、ボックス領域全体を使用するのではなく、「大きな」コンテナーに閉じるボタンを追加することですが、それは私が処理できる以上のものであることが証明されています.

ボックスのサイズとクリック検出を制御するために使用しているコードは次のとおりです。

クリックしたときに「大きな」ボックスが閉じないようにし、ボックス全体ではなく閉じるためのボタンを追加するにはどうすればよいですか?

前もって感謝します！！

私は小さなデモ/プロトタイプアプリに取り組んでおり、アイソトープを使用してdivのグループのフィルタリングをアニメーション化しています。divは色付きのブロックで、内部にテキストがあり、.ajax関数を使用して自動的に更新されてJSONデータを取得します。

このアプリは、ASP.NETMVCの完全なビューといくつかの部分的なビューのセットです。タイルは1つのビューにあります。タイルをクリックすると、ユーザーはそのタイルの「コンテンツ」の新しいビューページに移動します。ビュー間にアニメーション化されたフェードアウト/フェードインがあります。（これを作成した開発者は元々部分的なビューを持っていましたが、戻るボタンが機能するための要件が​​追加されました。これがすべてのコンテンツが完全なビューに変更された理由です...そして残念ながらトランジションが途切れ途切れになっている理由です。）

私の問題は、タイルをクリックすると、同位体divがフェードアウトする前に点滅することです。

わかりやすくするために、ここに小さな図を示します。:)

この種のフラッシュを引き起こすフェードを処理するjQueryクリックイベントには何もありません。クリックイベントは現在のinnerContentをフェードアウトし、コンテンツがフェードアウトした後、次のビューをwindow.location.hrefでリロードします。メインのMVCレイアウトは、次のビューのフェードインを処理します。ステップスルーするとき、またはアラートボックスのデバッグ（クリック機能の各ポイントにalert（ "i'm at this point"）を挿入する）を実行すると、フラッシュが表示されません。

これは、タイルクリックを処理する関数です。

var appName = "Applications>" + $（ "＃" + divId）.attr（ "data-tile-appName"）; localStorage.setItem（ "breadcrumb"、appName）;

$（ "＃innercontainer"）。fadeOut（250、function（）{window.location.href ='@ Url.Action（ "Application360"、 "Larry"）？an ='+ appName;}）;

そして、これはすべてのビューのフェードインを処理するメインのレイアウト機能です。

何が起こっているのかについてのアイデアはありますか？jsfiddleを投稿しなかったことをお詫びしますが、アプリは少し大きく、機密性が高いと考えられています（ご存知のとおり、いつものことです）。本当に必要な場合は、後で何かを作り上げることができます。プロトタイプでこれを解決することはそれほど重要ではありませんが、できるだけ滑らかに見えるようにするとよいでしょう。ありがとう！

私は記事の見出しをたくさん持っており、それぞれに出典に応じたクラス名が付いています。サイトが読み込まれると、すべてのヘッドラインが表示されます。ソースはページの上部にリストされており、ユーザーがお気に入りのソースを選択できるように、Isotopeをクリックしたときにそれぞれを表示または非表示にします。

現状では、それらを削除しても問題ありませんが、それらを再び表示する方法がわかりません。

問題は「挿入」コードにあると思いますが、それがどのように機能するのかわかりません。Infinite Scrollも使用していますが、新しく追加したページを同じフィルターを使用して表示する必要があります。

助けてください！

マーティン

jqueryアイソトーププラグインに問題があります。何らかの理由で現在のレイアウトでは機能しません。基本的に左側にサイドバーが必要で、右側に小さなボックス（アイソトープ要素）の束を含むコンテナが必要です。アイソトープと同様に、ブラウザのサイズに応じて向きを変えます。

何らかの理由で、同位体は私のレイアウトを好みません。ロード時に、サイトは右側に同位体要素を簡単に表示しますが、すぐに消えて、#container幅がなくなります。

プラグインを使用するのはこれが初めてで、非常に基本的なものが不足しているかどうかはわかりませんが、他のすべてのhtmlを削除してそのままにしておく#containerと、同位体は期待どおりに機能します。

すべてのコードをいじくりまわしました。

ありがとう！