I would like to use something like the bgstretcher plugin from Ajax Blender
bgStretcher jQuery Plugin Allows to Add Background Image to Page and Proportionally Resize it to Fill Entire Window Area. — ajaxBlender.com
It is a background slideshow plugin which works by inserting a set of images into a div (faking it to look like the page background) and scales them proportionately to the size of the browser window. It's great but I have one major issue with it...
Because these images are inserted into a div, their position is locked to the top and left of the div and there is no way to adjust this. Therefore when the browser window is very wide but not very high (ie letterbox shaped as happens on a 16:9 display running full screen with lots of browser controls - address bar, bookmarks bar, toolbars etc), this means that images are quite severely cropped and all the cropping happens at the bottom of the image. So the top half of the image is visible and the bottom half of the image is lost.
What I want to happen in this scenario is for the vertical centre of the image to be locked to the centre of the browser window, so that the images are cropped at both the top and the bottom and the centre of the image is always in the centre of the window.
If the script was set up so that the images came in as background images this would be easy to do by simply applying a css position:left center; to the background images - but it's not set up that way unfortunately...
On the bgstretcher thread, this vertical centering seems to be a common request and they have said that the next version will support it, but AjaxBlender seems to have gone very quiet - they said that the new version would be released Jan 11th but it wasn't and they have not replied to the thread since Jan 23rd - more worryingly, they have not replied to my 3 requests for a custom quote to do this.
Does anyone know of an alternative script that would let me do this or perhaps point me in the right direction to getting bgstretcher to do what I want?
Is the lack of response due to it being a rubbish/unclear question or simply that no-one knows?
I would really appreciate any suggestions on a way forward to getting images to centre vertically using this script, or anything else.
Some alternatives that you might wish to experimental with come from this tutorial:
How To: Resizeable Background Image | CSS-Tricks
What's the Weather? - Enter your location
Full Page Background Image | Progressive
To get a more centered approach to things appears to be a highly CSS-based solution.
Paul - you're brilliant!
The very last comment on the link you posted pointed to this jQuery plugin:
Supersized - Full Screen Background/Slideshow jQuery Plugin
which at first glance, appears to do exactly what I want, including the vertical centring!
thank you, thank you! - total lifesaver!