0

モザイクの方法でフォト ギャラリーを作成できる jQuery スクリプトをいくつか見てきました。このhttp://www.themepunch.com/codecanyon/megafolio/megafolio_dark.htmlまたはこのhttp://www.themepunch.com/codecanyon/megafolio/megafolio_light.htmlのように

私の写真にはさまざまなサイズがありますが、ほとんどの写真は高さよりも幅が大きくなっています。私の目標は、手動で切り抜いてさまざまなサイズのサムネイルとして設定するのではなく、画像のコンテナーのサイズを自動的かつランダムに設定する (そして元の画像を読み込む) ことです。

たとえば、最初の入り口 img1.jpg では 100x50 として表示されますが、更新すると同じ画像が 50x100 として表示される場合があります。

私の質問は、CSS と JavaScript を使用してこの効果を作成するにはどうすればよいですか?

4

1 に答える 1

1

質問のリンクに基づいて、縦型、横型、正方形の 3 種類の画像が表示されます。したがって、ランダムなサイズではありません。

また、グリッドレイアウトできれいにレイアウトされているように見えます。縦の画像の幅は横の画像の幅の半分で、縦の画像の高さは横の画像の高さの 2 倍です (つまり、基本的に反転しただけです)。正方形の画像は、横の画像または垂直画像。

グリッドと列のサイズを設定することで、画像を含むコンテナーを動的に配置し、より適切な用語がないため、それらに形状と向きを割り当てることができます。.css一部の jQuery では、関数を使用して、他のコンテナーに対して相対的に簡単に配置できます。

注:この例で使用されているサムネイルは、コンテナーのサイズと同じです。これは、目的の効果を確実に得る方法として、あなたにとっても良い考えです.

于 2012-07-03T00:24:45.663 に答える