Codeinwp / Nivo-Lightbox-jQuery

A simple, flexible, responsive, retina-ready jQuery lightbox plugin.
http://dev7studios.com/nivo-lightbox
MIT License
157 stars 87 forks source link

Problem with recognizing images with query string (fix included) #18

Closed Eccenux closed 9 years ago

Eccenux commented 10 years ago

There is a slight problem that makes image preview appear with scrollbars on Chrome. It occurs e.g. on Drupal when you choose to have scaled image displayed instead of the original one.

The problem is that url looks like this "blah.jpg?some-stuff".

Simple fix - change this:

href.match(/\.(jpeg|jpg|gif|png)$/

To this:

href.match(/\.(jpeg|jpg|gif|png)($|\?)/
josh18 commented 9 years ago

Alternatively you could change it to

if (href.match(/\.(jpeg|jpg|gif|png)$/i) !== null || link.attr("data-lightbox-type")=="image")

which would also solve issues if the image has no "image" extension. For example if you are using images served from Google Cloud Storage.

Eccenux commented 9 years ago

@josh18 For such cases you could add a parameter to src attribute e.g. &extension=.png. Would be shorter then adding a special attribute.

josh18 commented 9 years ago

@Eccenux That's a good idea, it does seem a lot messier though.

fritzmg commented 9 years ago

This is a more general problem. URLs to images aren't always a direct resource path. In addition to the problem with parameters as described above, your image URL could be something completely different, like http://placehold.it/350x150 or http://lorempixel.com/400/200

Having to artificially add a query string parameter that ends in jpg or png etc. is indeed messy and relatively complicated. It would make much more sense if you could force the lightbox type to image, as josh18 suggested.

fritzmg commented 9 years ago

Additionally, the hack of extending the href attribute with something like &extension=.png or just &.png does not work in case you are trying to open a public facebook image in the Nivo Lightbox.

Example: