0

内容に応じて高さが異なるブロックがいくつかあります:JSFiddle

コンテンツの高さよりも高く、それより低くならないようにしたい。

それは簡単です:

        $(".block").each(function(){
            $(this).resizable({
                 handles: 's',
                 minHeight: $(this).height()
            });                     
        }); 

ただし、一部のブロック(例では4番目)の高さはすでに固定されており、上記のコードを使用すると、このブロックを以前より小さくすることはできません。

コンテンツの高さをminHeightとして設定して、空きスペースを避け、ブロックをコンテンツよりも小さくすることを禁止する方法はありますか?

すべてのブロックのコンテンツを別のブロックに配置し、そのdiv高さをminHeightとして設定するというアイデアがありますが、要素の構造を変更せずに別の方法があるのではないでしょうか。

[UPD] @Eopin高さをリセットしたくない場合、コードは次のようになります。

        $(".block").each(function(){
            tmp = $(this).css('height');
            if (tmp != 'auto') {
                $(this).css('height', 'auto');
            }
            $(this).resizable({
                 handles: 's',
                 minHeight: $(this).height()
            });     
            if (tmp != 'auto') {
                $(this).css('height', tmp);
            }                               
        }); 

それは機能し、スクリプトが機能しても視覚的な変化は見られません。速度はブロック<50でも正常です。解決策のようです。他の回答を数日待ってから、質問を閉じます。

4

1 に答える 1

0

要素のheightプロパティを次のように設定して、設定を解除してみてくださいauto

$(this).css('height', 'auto');

また、ブロックがcssプロパティではなくheight属性を使用している場合は、次のようになります。

$(this).attr('height', '');
于 2012-04-23T09:32:09.177 に答える