Masonry script<\/a> to display image grids. But I only need this function if the viewport is wider than a particular width. If the viewport is narrower than this width, the images are displayed below each other, and for that, I do not need to initialize the script. This post shows you how to get this behavior working.<\/p>\n\n\n\n\n\n\n\nAt first the preliminary. It is not enough to check the viewport width on page load and run the script or not, depending on the result of the viewport width test. We also want to consider the case of resizing the viewport, and then possibly run the script or destroy a running instance. Besides that, we want to make it possible to use multiple grids per page.<\/p>\n\n\n\n
That is the finished script (my first attempt had a small but critical error \u2014 the final version owes its smooth operation to the help of David DeSandro<\/a>):<\/p>\n\n\n;(function<\/span> (<\/span>) <\/span>{\n var<\/span> msnry;\n