https://github.com/vjeux/gallery

Lightbox like the one on Facebook
https://github.com/vjeux/gallery

Last synced: about 1 month ago
JSON representation

Lightbox like the one on Facebook

• Host: GitHub
• URL: https://github.com/vjeux/gallery
• Owner: vjeux
• Created: 2012-05-01T02:55:00.000Z (over 12 years ago)
• Default Branch: master
• Last Pushed: 2012-05-02T03:45:34.000Z (over 12 years ago)
• Last Synced: 2024-04-14T15:07:22.211Z (9 months ago)
• Language: JavaScript
• Size: 352 KB
• Stars: 4
• Watchers: 5
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
Gallery

=======

There are dozens of lightbox plugins out there but none of them do what I needed. So here is my implementation of a lightbox.

 - Have a URL to be able to hotlink the images

 - Support for gallery

 - Ability to integrate only adding a single new bbcode [gallery=name][/gallery]

 - Image resizing based on screen size

 - Fullscreen view

 - Standalone. Doesn't require jQuery.

__________________ 

Some other goodies that were not part of the original needs:

 - Smart resizing. The gallery will never shrink when you change image. It will give you a consistent click target to go to the next image.

 - Agressive preloading of the next images

 - Smart click targets. Only the left 20% of the gallery is going previous. The right 80% is dedicated to what you want to do most often, go to the next image.

How to use

===========

Add in your code the following HTML:

```html



  

    

  

  



```


Somewhere in your page:

```html

```

That's it, you have a gallery!

Advanced

========

If you don't want to wait for the end of page to load to get your lightbox working. After each gallery add the following snippet:

```html

Gallery.init();

```

- When the gallery is opened, it will replace the full hash part of the URL. Be ready for it.

- It doesn't work with IE6, 7, 8. The URLs will stay URLs though, so people will still be able to see the images.

------

Disclaimer: I'm a Facebook employee but this work is not a Facebook product. I just did it on my spare time as I needed a good lightbox. I recoded it from scratch, it doesn't use any of the Facebook code. The left, right and fullscreen images are from Facebook though ...