thomaskekeisen.de
From the life of a screen worker
Attention: This page contains partner and advertising links. Therefore this page is to be understood entirety as an advertisement!
Initial situation
When I developed my site and as I just finished, I noticed that it still was not possible to click on images to view a corresponding larger version of it. After a short research job I decided to use lightbox2.js.
The problem: I wrote my gulp script in a way that concatenates jQuery or Bootstrap in a single file. So the clients browser and also my server has to deal with less single http requests. This file is located in the <head> area of my website. And that caused lightbox.js to be executed before the images it targets are loaded. Also lightbox2.js does not wait until the browser finished rendering the whole <body> .
The solution
The documentation of lightbox2.js does not provide a fix for this issue. But after a short review of the source code I noticed how this problem could be fixed. I use jQuery to wait for the browser and the <body> part of my website to run lightbox2.js manually when everything is ready. You can find a working example in my Sitemap.
$(document).ready(function() {
lightbox.init();
});