metafizzy / flickity

:leaves: Touch, responsive, flickable carousels
https://flickity.metafizzy.co
7.54k stars 602 forks source link

imagesLoaded option broken when images are children of cells #27

Closed virgo79 closed 9 years ago

virgo79 commented 9 years ago

Hi,

Thanks for this awesome plugin. I'm trying to use flickity toghether with imagesLoaded for a correct images loading.

I noticed that, if each image is placed into a parent div, imagesLoaded does not load correctly them and layout breaks. To better show the problem I have build the two following links:

1) Correct image loading: flickity.virgotest.com/imgnodiv.html

2) Broken image loading: flickity.virgotest.com/imgdiv.html in this example each img tag is inside a div element.

I attach below a screenshot from the chrome debug console. I suggest to use chrome to verify the issue. Firefox seems to show the layout without breaking, but report an error too.

flickity-imagesloaded

Giving a parent div to each image is necessary, for example, if you wish to show captions for images.

Maybe ticket #10 could be connect to this?

virgo79 commented 9 years ago

The problem is that getCell (at line 3568) return undefined if img is inside a div parent. However this will not break the layout. Layout will break (chrome and safari) if img elements has max-width set to 100%. Setting max-width to none in all img elements everything works fine.

desandro commented 9 years ago

Thank you for reporting this issue. This sounds like a legitimate bug. I'll have to look into it.


Thanks you for this feedback. If you like stickers, email me yo@metafizzy so I can send some your way.

desandro commented 9 years ago

Fixed in Flickity v0.2 :white_check_mark: