グルーピングやレスポンシブにも対応した高さを揃えるjQueryプラグイン jquery.matchHeight.js

スクリーンショット 2014-09-08 22.50.11

jquery.matchHeight.jsはコンテンツの高さを揃えるjQueryプラグインです。

よくあるプラグインですが、marginやborderなどのスタイルを考慮してくれたり、レスポンシブデザインにも対応していたりとなかなかに高機能です。

スポンサーリンク

特徴

↓padding, margin, borderなどのスタイルを考慮してくれます。

スクリーンショット 2014-09-08 23.05.25

↓行ごとに高さを揃えることができます。

スクリーンショット 2014-09-08 23.00.08

↓行ごとではなく、全体の高さを揃えることもできます。

スクリーンショット 2014-09-08 23.04.15

↓入れ子にも対応しています。

スクリーンショット 2014-09-08 23.05.13

↓高さを揃える要素を指定することもできます。要素は行をまたいで指定することが可能です。

スクリーンショット 2014-09-08 23.06.37

↓レスポンシブデザインにも対応しています。

スクリーンショット 2014-09-08 23.08.28

基本的な使い方

jQueryと一緒に読み込みます。

高さを揃える要素を指定して、matchHeight()を実行します。
デフォルトでは行ごとに高さを揃えてくれます。

デモとダウンロード

スポンサーリンク
jquery.matchHeight.js – グルーピングやレスポンシブにも対応した高さを揃えるjQueryプラグイン

みんなが見ている人気記事

コメントを投稿する

  • Posted on 2014.09.08
  • Views 1,598