Stack Overflow
Stack Overflow

Questions tagged [packery]

Packery is a pure JavaScript/jQuery layout library that intelligently lays out elements so as to fit them into as small a space as possible.

Packery is a JavaScript layout library that uses a bin-packing algorithm to fit elements together with as little space between them as possible. This is a fancy way of saying "it fills empty gaps." Packery layouts can be intelligently ordered or organically wild. Elements can be stamped in place, fit in an ideal spot, or dragged around.

157 questions
2
votes
2 answers

Packery + ajax loaded content + relayout packery

I am creating a layout with the Packery library from Metafizzy where i list post titles and thumbnails. Once these are clicked, I am hiding the initial content, and then ajax load the rest of the post to replace that initial content. I am looking…
ak_malmo
  • 97
  • 1
  • 15
2
votes
1 answer

Use Google WebFontLoader to Call Script after Font is Loaded

I want to use Google's WebFontLoader to call a javascript function after all fonts are loaded. The script I want to call is Packery and imagesloaded: var container = document.querySelector('.layouter'); var $pckry; var $pckry = new Packery(…
Christoffer
  • 77
  • 7
2
votes
1 answer

How to avoid gaps in fluid grid using packery

I am an amateur and beginner trying to make my first web page with a fluid image grid for vertical and horizontal photos with same height. So I am applying the Packery javascript to make it more responsive. See link to Codepen:…
nor159
  • 23
  • 5
2
votes
2 answers

How can I use packery with polymer elements?

I've been searching for hours now on how to use packery in combination with polymer elements. What I want to achieve is an element that is a content list, with in it an element that's the content item. I want to content items to be "packaried". To…
kingflurkel
  • 23
  • 5
2
votes
1 answer

Packery layout with draggable divs does not respect the item order

I'm using Packery & Draggabilly in an Angular.js application to create a dashboard-like setup where a user can dynamically create windows that are added to the Packery layout. The problem I'm having, I think, is related to fitting Packery and…
amergin
  • 962
  • 1
  • 12
  • 32
2
votes
1 answer

Bootstrap + packery

Im trying to use packery to align some divs. Everything is working fine but I get an annoying space that I don't know how to get rid of. This spaces only appear from 2nd row and they keep going.
kechap
  • 2,077
  • 6
  • 28
  • 50
1
vote
1 answer

Unable to get Packery item layout order

I am trying to make a layout mixed width/fixed height boxes to work using Packery. While I can get Packery to work, and lays things out fine — I need to know the order as presented on screen after the layout is completed (not the order of the DOM)…
Eivind B
  • 21
  • 3
1
vote
0 answers

Packery draggable in React Component

I am building a product grid order tool for an e-commerce website. It allows the merchandiser to change the order in which the products display. This is achieved through drag-and-drop superpowers of Packery by David Desandro…
Dylan Nirvana
  • 13
  • 1
  • 7
1
vote
1 answer

Packery init without triggering layout

I have packery with jQuery Draggable all setup and working correctly on my development environment. At the moment I am saving my ordered (packery) html to the database. Before everything is inserted to the DB I change the order of the dom elements…
23creative
  • 21
  • 6
1
vote
1 answer

Packery grid overlays Bootstrap 4 menu notifications dropdown

I'm building a site using Bootstrap 4 that has a notification dropdown, which is intended, naturally, to overlay the content of the main body of the page. The problem is, even with z-index: 10000 on the dropdown, the Packery grid items continue to…
Amanda Harvey
  • 529
  • 5
  • 24
1
vote
0 answers

Can I have an Isotope container maintain its height after applying filters?

I have a container with a bunch of items, like so:
...
I am using Isotope v3 to apply the Packery layout and prepare for filtering, like so: var $iso =…
ACJ
  • 2,499
  • 3
  • 24
  • 27
1
vote
2 answers

Packery - Adding element by jquery click

I am intending to create a set of textboxes that can be rearranged. The user is to be allowed to create text boxes and then fill them with text. As he keeps rearranging them the text gets automatically updated in the textarea. I am using packery…
Echchama Nayak
  • 971
  • 3
  • 23
  • 44
1
vote
1 answer

Isotope with packery gives Error: No layout mode: packery

Im trying to use Isotope with packery but I keep geting the following error "Error: No layout mode: packery" Heres the code: Html :
gemas
  • 23
  • 4
1
vote
0 answers

Overlapping elements with Packery and Infinite Scroll 3

I'm implement in my project packery + Infinite scroll 3, but when I scroll the page, and new items are loaded, these do not respect packery. var grid = document.querySelector('.masonry_base'); var pckry = new Packery( grid, { itemSelector:…
LegoLiam
  • 97
  • 3
  • 11
1
vote
1 answer

Packery: Enable Dragability And Gutter

I am using Packery a JavaScript library and jQuery plugin that makes gapless and draggable layouts created by David DeSandro. I use this to set up my portfolio but the following codes below are not working. I want to makes elements draggable…
user7843796
1 2
3
…
10 11