【jQuery】jQueryを使用した石積みレイアウトMasonry Ordered

Masonry OrderedはjQueryを使用した石積みレイアウト。

Markup

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script src="/path/to/jquery.masonry.min.js"></script>
<script src="/path/to/jquery.masonry.ordered.js"></script>

オプション

$('#container').masonry({
itemSelector: '.box',
columnWidth: 240,
layoutPriorities: {
// Masonry default: Try to occupy highest available position.
// Weight: Pixels of vertical distance from most upper spot.
upperPosition: 1,
// Shelf order: Try to display bricks in original order.
//   (increases ordered-ness, decreases space-efficiency)
// Weight: Pixels of distance of current brick's top left corner
//         from previous brick's top right corner.
shelfOrder: 1
}
});

MITライセンス

 
jQuery Masonry Ordered

【jQuery】jQueryを使用した石積みレイアウトMasonry Ordered

  • LATEST
  • RELATED
  • POPULAR