問題タブ [equal-heights]

確かに、私はこれに慣れていませんが、数冊の本を読んだり、オンラインで検索したりしましたが、必要なものがまったく見つかりません。したがって、どんな支援も祝福になります。

nav リンクをクリックすると、適切なページの「#content」div が現在のページの「#content」div にロードされる関数を設定できました。この問題は、アドレス プラグインでディープ リンクを実装しようとしたときに発生しました。ページから「#content」divだけをロードする方法がわかりません。

ここでライブを見ることができます: www.theeastcoastclassic.com/index1.html 下のナビゲーションにはまだ元の .load 関数があり、上のナビゲーションはディープ リンク機能を使用しています。

ここに私の.jsファイルがあります:

これは要約された HTML です。

また、equalHeights 列に関するヒントがあれば教えてください。このプラグインは非常にシンプルですが、ブラウザーごとに表示が異なるようです。多くのスクロールバーが表示されます。

私は、いくつかのコンテンツの要約を表示するために、Web サイトで簡単な列分割セクションを管理しています。各コラムの最後にリンクがあります。例を次に示します: http://jsfiddle.net/CV4Yr/2。

問題は、これらの続きを読むリンクをセクションの下部に配置して、3 つの続きを読むリンクがすべて水平方向に並ぶようにするにはどうすればよいかということです。列の高さが同じに見えることに注意してください。これは、負のマージンを使用したトリックにすぎません。

もちろん、多くの JavaScript ハックを想像することはできますが、むしろ避けたいと思います。

ありがとう

編集:フィドルの正しいバージョンへのリンクを修正しました。列の高さが同じになりました。

このマークアップで：

次のようにスタイルを設定するにはどうすればよいですか。

各ペアの高さが同じになるように？高さは、コンテンツが長い記事から取得する必要があります。つまり、 CのコンテンツがDより長い場合、DはCの高さと一致する必要があります。

今まで試したのは古き良きフロートですが、フロートなので中身によって高さが変化します。

私も同様のことをグーグルで検索しましたが、私が見つけたのは、余分なコンテンツを隠すだけの固定高さの列です。

私はこのマークアップを持っています：

これはフロートされ、2列のリストを形成します。各記事は、その内容のために可変の高さを持っています。

私が欲しいのは、2つのペアのどちらが最も高い高さであるかに基づいて、各ペアが同じ高さを持つ必要があることです。私はequalHeightsプラグインのバリエーションを見つけましたが、それらはすべてすべての要素に同じ高さを強制します。すべての要素ではなく、各ペアが同じ高さである必要があります。これは可能ですか、それともこのための既存のプラグインはありますか？

注：CMSによって出力されるため、記事のマークアップを変更することはできません。

私の期待する出力：

http://www.tmla.org/new_site/

それが関連するリンクです。ページを更新すると、問題が発生します。ブラウザまたはキャッシュから通常どおりページをロードするのは問題ないようです。なぜこれが起こっているのかわからない。誰かがこれに光を当てるのを手伝ってもらえますか？どんな助けでもいただければ幸いです。従うべきコード：

左右の列の両方に、高さが異なる 2 つのネストされた div があります。
これらの div はフレームのような形状を形成します。http://jsfiddle.net/5fA3q/を参照してください。

私はさまざまな css equal-height-tricks を試しましたが、それらは機能しますが、この状態では機能せず、ほとんど機能し、短い内部 div
padding-bottom:999999px;
margin-bottom:-999999px;
をabsolute配置するようになりました。

しかし、残念ながら、padding-bottomはなくなりました。http://jsfiddle.net/5fA3q/11/を参照してください

誰かが回避策を知っていることを願っています。

私は多くのcssの素晴らしい解決策などを知っています...短い話ですが、パディング、マージン、余分なマークアップ、シャドウ、背景色がないかどうかに関して、これが機能することを願っています...だから...私はmそのjqueryバージョンを探しています。

SOでいくつか見つかりました。応募しようとしています。ほとんど動作しているようです。ウィンドウを狭くすると、テキストが重なります。jsを無効にすると、無効になりません。

http://jsfiddle.net/ApUYv/4/

2つの質問：

1）テキストが重ならないようにするにはどうすればよいですか？

2）document.readyまたはwindow.loadを使用する必要がありますか？

注意：overflow: auto;設計者はスクロールバーを使用しないため、オプションではない場合があります。:(

この質問は何百万回も聞かれていることは知っていますが、もっと具体的なものを探しています。

私のサイトは完全にレスポンシブなので、すべてを1つの高さに設定するのではなく、行ごとに基づいてdivのサイズを変更する必要があります。

次の変更されたコードを使用して、コンテナー内のすべてのdivの高さを設定しています。

同じ行にある要素を特定する必要var thisTop = el.position().top;がありますが、同じ行のすべての要素を最高値に設定する方法がわかりません。

現在.height(curHighest);、同じ行にあるかどうかに関係なく、すべての要素を同じ高さに設定しています。

これを手伝ってくれてありがとう。

クロスブラウザCSSの例で同じ高さの列を使用する

HTML：

CSS：

より複雑なデモページがありますが、私は自分の目的のために最初の例を使用することを探しています。なぜ例が機能しないのですか？

http://jsfiddle.net/YryJM/2/

jQueryスクリプトを実行して、複数の行にまたがる行に同じ高さのdivを設定しています。

これは、私が使用しているコードの抜粋へのリンクですhttp://jsfiddle.net/F8QHd/2/

スクリプトについては、CSS Tricks http://css-tricks.com/equal-height-blocks-in-rows/のこの記事のテクニックを使用しました。

ウィンドウのサイズを変更しても機能するようにスクリプトを修正する方法を誰か教えてもらえますか? 現時点では、ページの読み込みで動作しますが、ウィンドウのサイズ変更に基づいてトリガーする方法がわかりません。スクリプトが使用する$(window).resize(function() {} );ので、なぜこれが機能しないのかわからないのですか?

どんな助けでも大歓迎です！

ありがとう。