passy / angular-masonry

An AngularJS directive for Masonry.
https://passy.github.io/angular-masonry
MIT License
1.12k stars 216 forks source link

Rearrange items on masonry-brick hover? #51

Open aniljailta opened 10 years ago

aniljailta commented 10 years ago

loading items with this library is working perfectly, and on mouseover two hidden div with data get showed and disappeared on mouseleave. But whenever i do it, all div's start shifting, floating i.e relayout. But i don't want these div's to get shifted. How can we achieve this?
Stackoverflow link: http://stackoverflow.com/questions/22200117/rearrange-layout-on-hover-using-angular-masonry

FoxxMD commented 10 years ago

You should try setting a fixed height for masonry-brick and then setting your container div(whatever is holding the visible+hidden) to 100% height. Make your visible div 75% height and hidden on hover 25% height. Your container will expand on hover but since it's still only 100% height of masonry-brick you won't get a relayout.