この前公開したmeca.jsに要素の高さ揃えの機能を追加しました。

詳しい使い方やデモはmeca.jsのページに書いたので、ここではmeca.jsをちょっと便利に使うために、ページ毎に設定を変更する方法を紹介します。

画像のロールオーバーとかはサイト全ページで有効にしておいて問題ないのですが、高さの揃えとかは特定のページだけで有効にしたいということもありますよね。meca.jsは外から設定の上書きができるので、特定のページだけ設定を変えるということも可能です。

特定のページだけ高さ揃えの機能を有効にするには以下のようにします。

meca.jsで機能を無効にする

[meca.js]
$.Meca.heightAlign.config.enable = false;

有効にしたいページで設定を上書き

上書きする設定はmeca.jsを読み込んだ後に書きます。

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="meca.js"></script>
<script type="text/javascript">
$.Meca.heightAlign.config.enable   = true;
$.Meca.heightAlign.config.selector = '#itemList li';
</script>

これでページ毎に設定の変更ができます。逆に、特定のページだけ機能をオフにするということもできますし、ページ毎にセレクタを変えるたりもできるので色々と便利じゃないかなーと思います。