DivGrow jQuery Plugin ? Easily make your DIV containers expandable & collapsable (with animation) HibboBlog

コンテンツの概要を好きな高さできっちりピクセル指定できデザインを崩させないjQueryプラグイン「DivGrow」。
ブログの記事の概要なんかを次のように画像の横に表示させるとして、このプラグインを使うことでピッチリと画像の高さをあわせてデザインをスッキリさせることが可能です。
通常こういうことをやろうとすると結構めんどくさいですがjQueryプラグインなので高さを渡してあげるだけで綺麗にそろいます。



で、「Show More」という部分をクリックするとアニメーションしながら元のコンテンツの文字がするすると伸びて表示されます。
ページ遷移もないのでストレスを少なくできますね。この「Show More」という文字列もオプションとして渡すだけで簡単に日本語に出来ます。



コンテンツ部分には画像なんかも入れられるようです。

レイアウトをきっちりそろえてテキスト量に関わらずデザインを崩さないというところで覚えておくと使えるかもしれませんね。

関連エントリ

• HTMLで雑誌のような美しい段組みレイアウトを軽く実現できるjQueryプラグイン
• シンプルなグリッドをレイアウトにオーバーレイ表示できるjQueryプラグイン「Griddy」
• クールなポートフォリオレイアウト作成Photoshopチュートリアル