【jQuery】水平方向にタイル状のレイアウトを作成するためのMasonry

Masonryは水平方向にタイル状のレイアウトを作成するためのjQueryプラグイン。

Javascript

$(document).ready(function() {
$('div#masonry').masonry({rowMinAspectRatio: 3.3});
});

Markup

<div id="masonry">
<a href="image01-large.jpg" target="_blank"><img src="image-01.jpg" width="2048" height="1369"/></a>
<a href="image02-large.jpg" target="_blank"><img src="image02.jpg" width="2048" height="1280"/></a>
...
<a href="image99-large.jpg" target="_blank"><img src="image99.jpg" width="1370" height="2048 /></a>
</div>

CSS

<style>
box-sizing: border-box;
border: 2px solid #fff;
</style>

MITライセンス

 
Masonry

【jQuery】水平方向にタイル状のレイアウトを作成するためのMasonry

  • LATEST
  • RELATED
  • POPULAR