Research Full Size Image Light Box

Hi Tim,

So if i understand correct: the images should be made responsive / converted to webp by ochResponsiveImages. Additionally a 'onClick' event should be added to the images that, on click, would open the largest version of the image in a popup window.

If correct > this is currently not part of ochResponsiveImages as, as the name of the plugin says, it is designed to make images responsive 'as is', not to add additional functionality that has (imo) nothing to do with 'responsive'.

Although this could be build into the plugin, question then is (for me as a developer) how would the popup image need to be displayed. There are a lot of 'frameworks' out there (light box being one of the many) to display a popup image. For me this is important as I want the plugin the be not only build for one customer, but to 'fit' the most possible.

Do you have any thoughts on this?

Hi Tim,
no problem, will ping you on twitter as well just to make sure you get the notification

as for the lightbox: this is implemented using clientside JavaScript (and css). There are a lot of opensource candidates out there, most of them based on jQuery (that is no nogo for me as that then also carries the load of the jQuery framework).

The one you are describing is what JCE Mediabox looks like, for me that looks a bit 'outdated'. I have found this one myself that could be implemented: biati-digital.github.io/glightbox/

So how this works is that you can manually add a (configurable) class name to the image (but also video / iframe) and then the JavaScript will handle the rest.

ochResponsiveImages will load the css and JavaScript and initialise the element with the (configured) class name on the page.
ochResponsiveimages could also be setup to add the class name to the images it handles on the page.

This would then be an additional feature to ochResponsiveImages making it a completer toolkit and givig you as site developer some powerful image handling options.

I have just done a quick scan of 'pure javascript open source image viewers lightbox' projects, the package we select here should be 'popular', maintained and 'light', so if you are able to also search / investigate or maybe provide me with some example websites that have a good lightbox implemented, that would be great.

As for the timeline. i have currently a 'big' update in the works where ochResponsiveImages will also handle non-image elements (e.g. a div) that have a css background-image set (like the fullpage images you see on my front page). I will be releasing that in September (will be on holidays the next 4 weeks and do not want to run the risk of breaking things when I am mainly off-line). So after that is released and we have a good JavaScript 'lightbox' I can start implementing that.

What do you think?

Holidays are spent in 'low maintenance mode' so will not be releasing a popular plugin with the risk of spending my free time behind the laptop

While in holiday mode I'll ponder on how to implement this and if there are other cool things that we could do.
If you could have a look at a good 'lightbox' script pure JavaScript, no jQuery, Open Source) that would be welcomed. Maybe ask your network? that would then also help spread the word / this plugin

And thanks again for thinking along, really appreciate it!

regards,
Ruud.