rotate plugin - images very squashed on first load SOLVED

[lrj]

I'm using the rotate plugin & jquery for a slideshow. All is well, but on Firefox 3.6, quite often the first pic shows fine, but pics after that are all squashed up into a few pixels height. If I then refresh the page in the browser, it loads fine with no squashing of pics.

See www.kidsnaturally.com/cms_made_simple/galleries/firstyear-gallery.html

I think it may be a timing problem - perhaps the images aren't fully loaded before jquery tries to display them?
The 15 images are typically 30kb in size & I'm testing on a standard UK broadband line (about 4Mbs)

I've edited rotate slightly for this website, but I'm a beginner at this....

Thanks

[Darwin Web Design]

Yes this happened to me too. I checked your website and the third photo onwards are squashed vertically, but width seems fine for all.

To fix mine, I made sure all of my photos were all exactly the same size in height and width and then added this pixel dimension to the code, so it forced it to load all photos at the correct size. This seemed to work for me.

For example in the template:

Code: Select all

{rotate path="uploads/images/slides-home/" effect=uncover width=500px height=245px}

I realise that won't help if you have variable heights on your photos so will be interested to hear if there is another workaround...

[lrj]

Brilliant!   I had the same thought lying in bed last night....

I've had to fix the height of all the photos so they are the same, but now it works fine.
(I used "canvas size" in photoshop to add a border which matches the colour of the website background, so it becomes invisible. The border size varies between photos, but its quick to do in photoshop).

Thanks !!!