search

dbrekalo / simpleLightbox

SimpleLightbox is lightweight and responsive lightbox library with no dependencies. Display images, galleries, videos or custom content and control your lightbox with easy to use api.
http://dbrekalo.github.io/simpleLightbox/
MIT License
270 stars 76 forks source link

Great plugin. #1

Closed Erehr closed 8 years ago

Erehr commented 8 years ago

Really it's really great. Similar in functionality to Magnific Popup but with 5x less code and cleaner css.

I know is probably how it has to be but i don't like how much div wrappers are there. Like 5 or 6 ? It would be great if this can be somehow reduced. (So far i changed overlay from rgb + opacity to rgba and used it as main wrapper = one div less ).

Also can't find it in description but can i use it to display modal / div / google maps and stuff ?

Thanks

dbrekalo commented 8 years ago

Thanks for great feedback - simple lightbox is inspired by Magnific Popup (great stuff really) but tries to actually do less stuff - and there lies the reason for smaller codebase. I always try to do modules that are kinda small compared to alternatives - smaller codebase is easier to read, maintain and load on traffic heavy frontend.

One of the reasons why Magnific popup is great for me is how it delegates lots of positioning to css in contrast to other popular alternatives. This technique requires a bit more markup (wrapper elements) - but personally i don't have a problem with it because markup is generated and inserted by javascript and does not affect SEO and semantics of your initial html payload.

Custom content can be set like so:

$.simpleLightbox.open({
    content: '<div>This is my modal</div>'
});

As for diplaying custom content as modal - there is no "modal" option by default, however it think it can easily be achieved by following options:

$.simpleLightbox.open({
    content: '<div>This is my modal</div>',
    closeOnOverlayClick: false,
    closeOnEscapeKey: false
});