Web屋のネタ帳

その余白がもったいないと思う感覚とどうにかしようとするデザイン魂(2008/10) で取り上げたようなことの実際の実現方法の話。

jQueryで作るAmazon流リキッドレイアウト (ascii.jp 2009/4)

実は、ウィンドウ幅に応じて表示される画像やテキストブロックの数を変えるのは、スタイルシートでも可能です。「それでは、がんばってスタイルシートで定義しましょう」……というのではあまりおもしろくありませんし、この連載の意味もありません。そこで今回はもう一工夫加えて、ウィンドウ幅の変化に応じてダイナミックに、書籍のサムネイル画像がフェードしながら追加、削除されるようにします。

　使用するのは、おなじみの「jQuery」ライブラリです。前回の作例では「Prototype.js」ライブラリを使っていますので、最終的にはこれら2つを併用する形になります。