Facebook-Like Modal Library - Now supports mobile • Hacker News Board

Facebook-Like Modal Library - Now supports mobile

#1

Post by mikesilvis » Thu, Aug 15, 2013, 2:46 PM UTC

Facebook-Like Modal Library - Now supports mobile
github.com

Re: Facebook-Like Modal Library - Now supports mobile

#2

Post by Terretta » Thu, Aug 15, 2013, 3:01 PM UTC

Thanks for sharing this.

On iPad, starting portrait and rotating landscape redraws but same size (too small). Starting landscape and rotating portrait tries to redraw same size (too large) but breaks layout, pushing text below image.

I feel as though portrait mode on iPad might look better with white box below the otherwise extremely tiny image.

Looks fantastic on desktop Safari.

Re: Facebook-Like Modal Library - Now supports mobile

#3

Post by mikesilvis » Thu, Aug 15, 2013, 3:13 PM UTC

Terretta wrote: post #2

Thanks for sharing this. On iPad, starting portrait and rotating landscape redraws but same size (too small). Starting landscape and rotating portrait tries to redraw same size (too large) but breaks layout, pushing text below image. I feel as though portrait mode on iPad might look better with white box below the otherwise extremely tiny image. Looks fantastic on desktop Safari.

Thanks, I haven't quiet figured out how to make it truly responsive. That's why when you rotate it gets out of whack.

If you start with it in either orientation it should be fine though.

Re: Facebook-Like Modal Library - Now supports mobile

#4

Post by cmancini » Thu, Aug 15, 2013, 4:32 PM UTC

I actually needed something exactly like this yesterday, and was having issues getting Bookstrap's modal to do what I wanted. Thanks!

Re: Facebook-Like Modal Library - Now supports mobile

#5

Post by mikesilvis » Thu, Aug 15, 2013, 4:40 PM UTC

cmancini wrote: post #4

I actually needed something exactly like this yesterday, and was having issues getting Bookstrap's modal to do what I wanted. Thanks!

Yeah let me know if you have any problems.

Also if you do end up using it, then feel free to submit a PR to the readme to add your website.

Re: Facebook-Like Modal Library - Now supports mobile

#6

Post by jeffehobbs » Thu, Aug 15, 2013, 4:46 PM UTC

Very nice!

Re: Facebook-Like Modal Library - Now supports mobile

#7

Post by doughj3 » Thu, Aug 15, 2013, 5:54 PM UTC

Was confused for a moment, though this had something to do with "Likes" on Facebook. Just a small note, but should be Facebook-like, eh?

Re: Facebook-Like Modal Library - Now supports mobile

#8

Post by mclee » Thu, Aug 15, 2013, 6:13 PM UTC

doughj3 wrote: post #7

Was confused for a moment, though this had something to do with "Likes" on Facebook. Just a small note, but should be Facebook-like, eh?

Yeah i thought the same thing for a while.

Re: Facebook-Like Modal Library - Now supports mobile

#9

Post by bzalasky » Thu, Aug 15, 2013, 7:26 PM UTC

Facebook uses display: table for their modal so that they can center it vertically without worrying about JS (if the height is variable and/or unknown) or negative margins. As far as making it responsive, you just need to work on your styles a bit. Check out the image detail modal I made for Stipple.com (just click on an image in the feed). This implementation leans on Backbone.js a little bit, but for the most part, the markup and styles make up a majority of the library. The actual plugin just builds the dom elements, handles events, and provides callbacks.