masonry-layout

WebJar for masonry-layout

License

License

MIT
GroupId

GroupId

org.webjars.npm
ArtifactId

ArtifactId

masonry-layout
Last Version

Last Version

4.2.2
Release Date

Release Date

Type

Type

jar
Description

Description

masonry-layout
WebJar for masonry-layout
Project URL

Project URL

http://webjars.org
Source Code Management

Source Code Management

https://github.com/desandro/masonry

Download masonry-layout

How to add to project

<!-- https://jarcasting.com/artifacts/org.webjars.npm/masonry-layout/ -->
<dependency>
    <groupId>org.webjars.npm</groupId>
    <artifactId>masonry-layout</artifactId>
    <version>4.2.2</version>
</dependency>
// https://jarcasting.com/artifacts/org.webjars.npm/masonry-layout/
implementation 'org.webjars.npm:masonry-layout:4.2.2'
// https://jarcasting.com/artifacts/org.webjars.npm/masonry-layout/
implementation ("org.webjars.npm:masonry-layout:4.2.2")
'org.webjars.npm:masonry-layout:jar:4.2.2'
<dependency org="org.webjars.npm" name="masonry-layout" rev="4.2.2">
  <artifact name="masonry-layout" type="jar" />
</dependency>
@Grapes(
@Grab(group='org.webjars.npm', module='masonry-layout', version='4.2.2')
)
libraryDependencies += "org.webjars.npm" % "masonry-layout" % "4.2.2"
[org.webjars.npm/masonry-layout "4.2.2"]

Dependencies

compile (2)

Group / Artifact Type Version
org.webjars.npm : get-size jar [2.0.2,3)
org.webjars.npm : outlayer jar [2.1.0,3)

Project Modules

There are no modules declared in this project.

Masonry

Cascading grid layout library

Masonry works by placing elements in optimal position based on available vertical space, sort of like a mason fitting stones in a wall. You’ve probably seen it in use all over the Internet.

See masonry.desandro.com for complete docs and demos.

Install

Download

CDN

Link directly to Masonry files on unpkg.

<script src="https://unpkg.com/masonry-layout@4/dist/masonry.pkgd.js"></script>
<!-- or -->
<script src="https://unpkg.com/masonry-layout@4/dist/masonry.pkgd.min.js"></script>

Package managers

npm: npm install masonry-layout --save

Bower: bower install masonry-layout --save

Support Masonry development

Masonry has been actively maintained and improved upon for 8 years, with 900 GitHub issues closed. Please consider supporting its development by purchasing a license for one of Metafizzy's commercial libraries.

Initialize

With jQuery

$('.grid').masonry({
  // options...
  itemSelector: '.grid-item',
  columnWidth: 200
});

With vanilla JavaScript

// vanilla JS
// init with element
var grid = document.querySelector('.grid');
var msnry = new Masonry( grid, {
  // options...
  itemSelector: '.grid-item',
  columnWidth: 200
});

// init with selector
var msnry = new Masonry( '.grid', {
  // options...
});

With HTML

Add a data-masonry attribute to your element. Options can be set in JSON in the value.

<div class="grid" data-masonry='{ "itemSelector": ".grid-item", "columnWidth": 200 }'>
  <div class="grid-item"></div>
  <div class="grid-item"></div>
  ...
</div>

License

Masonry is released under the MIT license. Have at it.


Made by David DeSandro

Versions

Version
4.2.2
4.2.1
4.2.0
4.1.1
4.1.0
3.3.0