Hacker News new | comments | show | ask | jobs | submit login

I just implemented pretty much the same thing from scratch for my wedding gallery┬╣.

For each row, it tries 3-10 images, sums their aspect ratios, divides the total row width by the sum to get a candidate height, then picks the height that's closest to the average of the existing rows.

To make things look a bit nicer, it rejects candidate rows with the same number of images as the last row.

I might release the code on Github if I can make it modular enough. Currently it depends on jQuery but that's really only for element creation.

┬╣ http://mattandsophiegetmarried.com, I'm the guy with the waistcoat, purple cravat and massive grin.

I end up with some of the photos ending up behind other photos. Firefox 23 here.

Same in Firefox 22. Scrolling seems broken, and removing the "find on page" part of Firefox clears all the images.

Me too, Chrome 28.0.15

Same for me in FF25 (Aurora), and Opera Next 16.

I'm not seeing any images on Chromium. Just a blank white screen with "Matt & Sophie's wedding photos" at the top.

Congrats on the wedding though.

Maybe Chromium is blocking the redirection to cloudfront, where the images are hosted? I had to tell Firefox's RequestPolicy, to let these requests pass...

That looks pretty nice too! Congrats on the wedding!


The photos didn't appear correctly aligned though -- some 70-100px "whitespace" at the right edge of the screen. And resizing the screen removed all content.

edit: I'm using Firefox v22 on Xubuntu.

For me it displayed white rectangles initially - but disabling Adblock extension on Chrome worked (looks great).

However if you then resize the window it seems to make all the images disappear (?)

It's lazy-loading the images (otherwise, BAM 30MB download). The blank screen thing is the resize handler breaking. I'm looking into it.

Guidelines | FAQ | Support | API | Security | Lists | Bookmarklet | Legal | Apply to YC | Contact