Hei,
Sitter her med et bildegalleri og lightbox 2.
Noen av bildene mine er 2500x1400 å dette blir SVÆRT, så jeg googlet hvordan man kunne sette max størrelse, og fant dette :
Da satte jeg min max størrelse:
men bildet blir ennå åpnet i det store formatet, noen osm vet hva jeg gjør galt?
Sitter her med et bildegalleri og lightbox 2.
Noen av bildene mine er 2500x1400 å dette blir SVÆRT, så jeg googlet hvordan man kunne sette max størrelse, og fant dette :
I'll cover the major bases in this reply.
In the lightbox.css included with the download archive for 2.04 you can change the width and height to static pixel values instead of auto:
#lightbox img{ width: auto; height: auto;}
But of course all your smaller images than the dimensions you use will be distorted. CSS3 does have min-height/max-height and min-width/max-width that could be applied in the selector above, but technically CSS3 is in working draft an not supported on hardly any browsers yet.
Others here might post JavaScript hacks like this excellent cropper script to the Lightbox scripts that check the image size and conditionally set or crop style width and heights if they exceed a certain size, say browser window size.
If I was doing this, I'd focus on the upload. Once uploaded, if you support PHP with the GD library you can detect image size as well as file size or extension and reject large uncompressed files. Or resize them dynamically using GD, all done server side.
This PHP class does it all for you via GD - it's excellent (orginal colors and aspect ratio preserved)
Similar to how thumbnails are created server side. This method requires knowledge of PHP uploading and the GD library which is very common. So my official answer is don't rely on Javascript if a server side solution exists. Not everyone will agree with this because JS is "easier" - just remember my method saves you disk space as well as works across all platforms!
-jim
In the lightbox.css included with the download archive for 2.04 you can change the width and height to static pixel values instead of auto:
#lightbox img{ width: auto; height: auto;}
But of course all your smaller images than the dimensions you use will be distorted. CSS3 does have min-height/max-height and min-width/max-width that could be applied in the selector above, but technically CSS3 is in working draft an not supported on hardly any browsers yet.
Others here might post JavaScript hacks like this excellent cropper script to the Lightbox scripts that check the image size and conditionally set or crop style width and heights if they exceed a certain size, say browser window size.
If I was doing this, I'd focus on the upload. Once uploaded, if you support PHP with the GD library you can detect image size as well as file size or extension and reject large uncompressed files. Or resize them dynamically using GD, all done server side.
This PHP class does it all for you via GD - it's excellent (orginal colors and aspect ratio preserved)
Similar to how thumbnails are created server side. This method requires knowledge of PHP uploading and the GD library which is very common. So my official answer is don't rely on Javascript if a server side solution exists. Not everyone will agree with this because JS is "easier" - just remember my method saves you disk space as well as works across all platforms!
-jim
Vis hele sitatet...
#lightbox img{ width: 800; height: 600;}
#lightbox a img{ border: none; }
#lightbox a img{ border: none; }
Vis hele sitatet...