Resizing Lightbox images

heidi — Sun, 13 Feb 2011 17:30:35 +0000

I’m using Lightbox2 in my newest project to show images. The images, though, are way too big to show in their original size. I was surprised that I couldn’t find a property or something in the code to resize the images. After some researching on Google and figuring out a resize calculation, I made the following adjustments to the code to resize my images without having to resize each one of them before uploading:

Lightbox.css

Change:
#lightbox img{ width: auto; height: auto;}

To:
#lightbox img{ max-width: 600px; }

Lightbox.js

Change:
imgPreloader.onload = (function(){
this.lightboxImage.src = this.imageArray[this.activeImage][0];
this.resizeImageContainer(imgPreloader.width, imgPreloader.height);
}).bind(this);
imgPreloader.src = this.imageArray[this.activeImage][0];
},

To:
imgPreloader.onload = (function(){
this.lightboxImage.src = this.imageArray[this.activeImage][0];
this.resizeImageContainer(600, imgPreloader.height / (imgPreloader.width/600));
}).bind(this);
imgPreloader.src = this.imageArray[this.activeImage][0];
},

I choose to always show the images with a width of 600px. So, if you want a different width, then change the 600 to the number you choose. You can also go with a height in stead of a width, but then you have to change the calculation formula a bit and use the max-height property in the CSS file.

Vectorize reality

heidi — Wed, 09 Aug 2006 18:40:54 +0000

Who wouldn’t love to create their own personal reality … imagine it, mold it, shape it, …
Well, these vector artists did an amazing job at it using gradient meshes. Make no mistake about it, these aren’t photographs. This vectorized reality was created with nothing but Adobe Illustrator …

The artists:
Wayne Forrest
Halim Ghodbane
Highside
Ussa Methawittayakul
Yukio Miyamoto
Alexandre Simionescu

And just to give you a quick preview of Ussa’s work:
Angel in progress
Angel outlined
Angel finished

Hope you enjoy these as much as I do

Through The Eyes Of A Dreamer » Design

Resizing Lightbox images

Vectorize reality