ジャンルなし説明もなしでただただ写真がずらっとあるページをつくろうと思います。perlで指定フォルダの画像を一覧表示させるプログラムを利用するので、画像には基本手を加えません。(デジカメサイズをweb要サイズに縮小するだけ)
また、写真の縦横比が固定ではないので、サムネイル作成にMyThumbnail.js(http://kwski.net/jquery/813/)を利用、さらに拡大表示にLightbox系拡大jqueryを利用します。
これを踏まえて・・・
画像一覧を並べるときに、<ul><li>でただ羅列するのではなく、手作りアルバム風だったり画像を回転させたりして可愛く表示するのになにか良い方法はないでしょうか?
Androidのアプリですが、こういうのを見つけました。
http://appllio.com/android-tool-app/20120531-2167-million-moments-sony
この画像一覧(http://appllio.com/sites/default/files/million_moments_001.jpg)の感じも良いなぁと思いますが、こういうのをcgiやjQuery・CSSで表現できるでしょうか?
出来るようだったらその方法を教えて欲しいです。
他にもなにか良い方法があれば教えて下さい。
イメージとしてこれなのかわかりませんが、リキッドレイアウトとか可変グリッドレイアウトとかっていうやつでしょうか。
http://www.mdn.co.jp/di/articles/2657/?page=16
これの5とか
http://webgaku.hateblo.jp/entry/2013/03/24/083440
とか
フォトギャラリーだと
http://coliss.com/articles/build-websites/operation/javascript/js-responsive-image-gallery-gamma-gallery.html
http://blog.creamu.com/mt/2012/10/jquery_responsive_tile_gallery.html
とか?
あと以下の真ん中付近とかjqueryのフォトギャラリーを探してみるとどうでしょう。
http://ideahack.me/article/713
返答有難うございます!
2014/06/09 23:43:47私が考えていたのはこんなかんじです。
ただ、どれも「かっこいい!」という感じで可愛くはないですね。可愛くなるのかなぁって予想したんですが・・・w
可愛いっていうのを表現するのって難しいですね・・・
全体の配置はjqueryで、背景や個々の画像の修飾をCSSでやれば良いんじゃないでしょうか。
2014/06/12 00:32:35バックグラウンドの小物とか、画像のフレームとか。
http://www.zzrock.net/archives/category/image/pretty
こういうのみると、ピンク系の小物とかリボンや花、レースっぽい装飾とかで演出してる感じ。
http://webdesignerwall.com/tutorials/css-decorative-gallery
これとかはかっこいい感じですけど、コルク風の背景じゃなくカーペット風にするとか、
木枠風じゃなくてリボン風とか。
http://webdesignrecipes.com/spice-up-web-design-with-css3/
こんなのとか。