最小カラムにあわせて高さを統一するjQueryプラグイン「EqualHeightCols plugin」
紙媒体をやっていた人などは各カラムの高さが統一していないと気になることもあるかと思います。
もちろんそうじゃなくても整然と要素を配置したい時はjQuery equal height columns pluginを利用すると最小カラムの内含要素に総てコラムの高さを統一してくれます。
sponsors
使用方法
jQuery equal height columns pluginからファイル一式をダウンロードします。
<script src="jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="jquery.equalheightcols.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
$('#id名').equalheightcols({
itemsToEqualize : 'li' //統一したい要素
});
});
</script>
あとは高さを統一したい要素を記述していきます。
<ul id="id名">
<li>テキストなど</li>
<li>テキストなど</li>
<!-- 以下要素分 -->
</ul>
最小カラムにあわせて高さを統一するjQueryプラグイン「EqualHeightCols plugin」サンプル
sponsors
記事作成:2011年3月25日 10:08
記事URL:http://www.skuare.net/2011/03/jqueryequalheightcols_plugin.html
TOP > javascript > テキスト関連 > 最小カラムにあわせて高さを統一するjQueryプラグイン「EqualHeightCols plugin」
前の記事:テキストサイズと位置をランダムに散らばらせ表示するプラグイン「jQuery Splatter Plugin」
次の記事:要素をブルブルさせるjQueryプラグイン「jRumble」
あなたにはこちもお勧め!
jQuery プラグインまとめ!