An Introduction to jQuery Masonry


show more What is jQuery Masonry? provides you with in-depth training on Web. Taught by Morten Rand-Hendriksen as part of the WordPress: Building Responsive Themes show less
please wait ...

What is jQuery Masonry?

If you've spent any amount of time on the Internet in the past few years, you've likely come across something very cool, called Masonry, though you probably had no idea that's what it was. Masonry is a jQuery plug-in that let's you create dynamically reorganized content on your site in a very nifty way. The best way to understand what Masonry does is to look at these two examples on the Masonry web site. It shows the content before and after applying Masonry. What's happening here is we have a page that has a bunch of items, so a regular index page, but we don't want to list them vertically like you would normally do; we want to list them horizontally.

The problem is some of the items are bigger than the others and as a result, they take up more space. If we use CSS to float these items left to right, what happens is the tallest item in each row defines the vertical height of that row and nothing can flow in to fill up that space. So what we end up with...

What is jQuery Masonry?
Video duration: 3m 41s 2h 55m Intermediate

Viewers:

What is jQuery Masonry? provides you with in-depth training on Web. Taught by Morten Rand-Hendriksen as part of the WordPress: Building Responsive Themes

Subject:
Web
Software:
WordPress
Author:
please wait ...