1

iframe を介して joomla サイトにロードしている Web サイトの別の部分を作成しましたが、iframe のコンテナーの高さを調整したいと考えています。

したがって、正常に動作する次のコードを使用して、html の高さを取得しようとしています (これを iframe 内から呼び出します)。

$(document).ready(function() {
    var height = $(document).height();
    alert( height );
});

高さはすべてのページで正しく警告されます。

iframeコンテナの高さを調整すると問題が発生します。このコードを使用すると:

$(document).ready(function() {
    var height = $(document).height();
    alert( height );
    parent.document.getElementById('blockrandom').style.height = height + 'px';
});

高さが以前の高さと同じかそれ以上になるため、高さが 900px のページから 500px のページに移動しても、高さは 900px のままになります (アラートでも)。小さい作品から大きい作品まで問題ありません。

前もって感謝します!

4

1 に答える 1

0

はい、ネイティブ プロパティまたは jQuery を使用して高さを調整すると、結果の高さの値が新しい値セットを反映していないように見えます。そのため、同じページのインタラクション中に要素を動的に調整するには、これまで、高さのヒューリスティックに頼る必要がありました。

最終的に、要素内のコンテンツを評価し、完全に正確ではないにしても、許容できるプロキシの高さの値を構築します。たとえば、22 個のラベル フィールドの元のセットを含むボックスがあるとします。

ユーザーが親の値またはオプションを調整すると、0 から完全な 22 までの任意の数の結果フィールドになる可能性があります。

したがって、ユーザー イベントの後に 10 個残っている場合は、表示されている要素をカウントアップして高さを計算する関数を実行します。したがって、10 フィールド x 22 ピクセルは、含まれている要素を約 220 ピクセルに再調整することを意味します。

具体的には、デフォルトの高さ、ベースの高さ (テキストや指示など、常に公開されている調整不可能な要素を許可します)、および要素の高さの乗数を割り当てる抽象化された関数があります。

ロード時およびイベント間で、要素コンテナーをデフォルトの高さに設定しました。変数要素を数えた後、変数要素に乗数を掛け、それをベースの高さに加算して値を計算します。

これまでのところ、これは私ができる最高のものであり、かなり単純です. jQuery セレクターを使用すると、カウントするのに数行しかかからず、高さを計算して設定するのにさらに数行かかります。

注意: これは、コンテンツによって高さを自動的に調整しない要素にのみ必要であることに注意してください。これの最大の違反者は、私の場合、この問題が発生する jQuery タブです。ほとんどの操作されていない相対高さ要素は、要素が display = block||none の間で切り替わるため、スペースを自動調整します。

コード例を次に示します。

setElemHeight = function(options) { 
    var _elem = options.containerElement;
    var _nBase = options.nBaseHeight;
    var _nMltplr = options.nMultiplierHeight;
    // COUNT ROWS
    var _nCnt = 0;
    $( '#' + _elem.id + ' div div:first-child  > input').each( function() { 
        if(this.style.display != 'none') _nCnt++; 
    });
    $(_elem).height(_nBase + (_nCnt * _nMltplr));
}

私は自分の目的のために十分に抽象化しましたが、セレクターの子要素が動的になるように、もう少し先に進めることができます。

于 2012-10-18T16:25:52.173 に答える