私はjqueryの初心者であり、jqueryがdivの最小高さをその中にあるコンテンツの量に基づいて調整する方法を追加する方法を知りたいです。min-height は常に 700 前後に設定したいと考えていますが、ユーザーが一部のページにコンテンツを追加すると、そのコンテンツに合わせて拡張する必要があります。
これを統合するにはどうすればよいですか?私はjqueryが初めてなので、css、htmlなどに関して具体的に教えてください。
単純すぎます:
HTML
<div class="foo" >
This is sample<br />
This is sample<br />
This is sample<br />
This is sample<br />
This is sample<br />
This is sample<br />
This is sample<br />
</div>
JQuery
$(function() {
$(".foo").css("min-height", function() {
return $(this).height();
});
});
誤解しない限り、ユーザーがコンテンツを追加するときに min-height を調整する必要はありません。min-height プロパティを持つ要素は、含まれるコンテンツに合わせて自動的に拡大されます。だから気にしなくていいんです。
例: スタイルシートに css プロパティを適用するとmin-height: 700px
、要素内のコンテンツが 500px のページでは、要素の高さが 700px になります。900px のコンテンツがあるページでは、要素の高さは 900px になります。