0

ギャラリーとして表示される画像 (サムネイル) のリストがあります。これらの画像の幅は固定で、高さは可変です。

しかし、画像の高さが可変であるため、ページはワイヤードに見えます

http://www.geoffreywarnerstudio.com/live-edge-2

jQuery や PHP を使用して見栄えを良くする、つまり、画像 4 を連続して自動的に調整する解決策はありますか?


アップデート:

コードを簡単にテストできるように、jsFiddle を作成しました: http://jsfiddle.net/alokjain_lucky/vHVcP/

画像をトリミングしたり、高さを揃えるために引き伸ばしたりしないでください。

4

6 に答える 6

0

サムネイルの画像の高さを圧縮する必要がない場合は、サムネイルに固定の高さを追加するだけです。

例:style.cssheight: 100px;に追加ul.small-thumb-3 li img

于 2012-06-08T06:50:15.507 に答える
0

同じサイズのサムネイルを作成するための便利なリンク:

http://www.plus2net.com/php_tutorial/php_thumbnail.php

于 2012-06-08T08:04:54.287 に答える
0

私は自分の要件に対して次のソリューションを作成しました:http: //jsfiddle.net/alokjain_lucky/vHVcP/

于 2012-06-27T05:31:36.663 に答える
0

CSS の代わりとして、基本的にそれを行うWordpress プラグインを次に示します。

于 2012-06-08T06:52:11.093 に答える
0

各サムネイルの高さを取得し、それらを配列に入れてから、natsort などを使用して、それらを最高から最低、またはその逆に並べ替えることができます。つまり、順序は重要ではありません。このようにして、同じサイズの画像を隣同士に並べると、見た目がわずかに良くなります。

画像サイズを取得するには: http://php.net/manual/en/function.getimagesize.php

また、「画像をトリミングしたり、高さを同じにするために引き伸ばしたりしたくない」と言います。したがって、画像を変更できない場合、他に方法はほとんどありません..

編集:これは少し見栄えの良いバージョンです: http://jsfiddle.net/vHVcP/10/

于 2012-06-08T08:14:36.800 に答える
0

画像の周りに境界線を配置し、境界線内で画像を動的に中央揃えにします。

http://jsfiddle.net/saluce/vHVcP/19/

于 2012-06-08T15:25:40.780 に答える