tholman / intense-images

A simple library to view large images up close using simple mouse interaction, and the full screen.
http://tholman.com/intense-images
2.58k stars 278 forks source link

Panoramic display issues #8

Closed ahallicks closed 10 years ago

ahallicks commented 10 years ago

Hi,

Firstly, this is a brilliant little tool and, in my opinion, one of the best ways to show the whole of an image on a web page. I've implemented it on a photography site and it works great up until it hits a panoramic image. It doesn't quite seem to get the dimensions correctly.

To see an example of this head to http://timhallphotography.co.uk/gallery/landscapes-the-elemental-collection and look at one of the bottom 3 images. The image appears in the top left and the scrolling moves the image of the edge of the window.

Thanks! thp

tholman commented 10 years ago

Hey @ahallicks - it looks like you've got conflicting css, where you are applying styles to all img tags... the particular style is max-width: 100%; which is breaking the sizing for images that need to be longer than the screen (panoramic ones).

The best fixes for you, would be to either remove the max-width property from your img css, or add "maxWidth": "none" to the imageProperties variable (line 168, of the current intense.js file)

Going to close the issue now, but let me know if that fixes things for you (testing it locally, it does!)

ahallicks commented 10 years ago

Hey @tholman

That fixed it, good spot! And thank you for the quick response :-)