1

私は必死に実用的な解決策を見つけようとしているという難しい問題を抱えています。

Aarticle#postと aaside#sidebarが左右に並んでいます - かなり単純です。my の中にarticle#postは ah1と aがありdiv.post-entryます。

div.post-entry外側のコンテナに対する の相対的なオフセットをどうにかして判断できるのだろうかsection#content。これを行う理由は、フローティング サイドバーをmargin-top「div.post-entry」と同じ高さに配置できるようにするためです。

これが私の現在のhtml構造のモデルです:

<section id="content">

    <article id="post">
        <h1>Title of the post</h1>
        <div class="post-entry">
            <p>Something</p>
        </div>
    </article>

    <aside id="sidebar>
        Something
    </aside>

</section>

div.post-entry繰り返しますが、上からどれだけ離れているかのピクセル値を取得するための解決策を見つけたいと思いますsection#content。

私が抱えている主な問題は、仕事をしているようにさえ見えないことですpost-entry.offsetTop。これは親でdiv.post-entryあるため、 に対する相対的なオフセットを取得する必要があります。article.postそれは実際に私にとってもうまくいくはずです。

var articleOffset = $('.post-entry').offsetTop;
console.log($('.post-entry')); //found and exists
console.log(articleOffset); undefined

これが私にとってもうまくいかない理由はありますか？ここで値が未定義になるのはなぜですかoffsetTop。<h1>オフセットする少なくとも「30px」のパディングを持つビッグがありますdiv.post-entry。

そのことについて何か考えはありますか？それを行う方法に関する他のクールなソリューションはありますか？aside#sidebar同じ高さで開始したいだけですがdiv.post-entry、マークアップを変更したくありません。

4

1 に答える 1

0

jQuery オブジェクトから DOM 要素を選択する必要があります。

var articleOffset = $('.post-content')[0].offsetTop;
于 2012-07-24T19:25:48.303 に答える