razorjack / quicksand

jQuery plugin. Reorder and filter items with a nice shuffling animation.
https://razorjack.net/quicksand/
GNU General Public License v2.0
1.86k stars 338 forks source link

Trouble with Quicksand function #29

Closed nintensity closed 6 years ago

nintensity commented 14 years ago

I need some help regarding Quicksand.

I'm trying to initiate Quicksand using lists as buttons but i'm getting awkward CSS style markup when I click on one of the filter links.

Please refer to http://www.nintensity.net/portfolio for the HTML markup, and then http://pastie.org/1166774 for the Javascript Markup.

nintensity commented 14 years ago

Sorry, and thank you!! :)

nintensity commented 14 years ago

Okay I got it, but I realized the plugin doesn't support fluid layouts

for example, the margins and width of the items inside the container are percentages, however when the function is called, its given a absolute position style, thus changing the layout and it goes all wonky.

razorjack commented 14 years ago

I think there's a bigger problem here. Quicksand, when it calculates destination positions, reads such CSS attributes as margin, position, padding etc. And it understands only one type of value: pixels. Ems, percentages won't work here. Of course we can parse all possible units and convert them to pixels but it would make the plugin soooo big and complicated. I'll need to find a different way. Maybe I should rewrite the whole plugin to utilize jQuery Position extracted from jQuery UI? I'll try it in v2.0.

All hope is in jQ Position, otherwise it's not really feasible… :(

davecartledge commented 12 years ago

Has a fix been applied to this issue at all?

I am having similar problems when using Quicksand with a fluid layout - it almost works, but not quite perfect :)

Any help would be much appreciated.

nstriedinger commented 12 years ago

I just ran into this percentage issue with applying quicksand to a responsive layout.

razorjack commented 6 years ago

The issue with responsive layouts is fixed in the latest version of Quicksand (v1.6.0). Please make sure to set adjustWidth (or even adjustHeight) to false so that Quicksand leaves the width/height values alone.