Resize your background image to any desktop resolution (Yes it works!!!)

One of my client wanted to have a a single background image on his website which will show up on the whole page. So it was a very easy task. I inserted the background image link into the css and done. But then he said that it is not showing up properly on his system. Then i realized that due to different resolutions on a system the image will not come up properly.  So i started searching the internet for this solution. I found many websites claiming that they have the solution. I tried almost all of them and the image will just not come fully inside my pane it will be cut off from the bottom or it will hiding behind the taskbar. After searching and searching i found bgstretcher. It is a jquery plugin which stretches the background according to the screen resolution, but even in this you have to specify the resolution. I was like whats the point? Then i used my own brain to figure out what i can do with this. The view area of a browser is called viewport. I searched up the script on how to get the viewport and then inserted that variable in the javascript which was calling the bgstretcher and voila! i finally had my background. I checked it in firefox, chrome and IE all versions and it works on any resolution.  Here is a working demo. And trust me people if this doesn't work for you then nothing else will.

Step 1: Download bgstretcher
Step 2: Place this code in your header.

<script type="text/javascript" src="js/jquery-1.5.2.min.js"></script>

<script type="text/javascript" src="js/bgstretcher.js"></script>

<link rel="stylesheet" href="css/bgstretcher.css" />

<script language = "Javascript">

var viewportWidth = $(window).width();  //this is my addition

var viewportHeight = $(window).height(); //this is my addition

$(document).ready(function(){

  //  Initialize Backgound Stretcher

$('BODY').bgStretcher({

    images: ['images/bg.png'], imageWidth: viewportWidth, imageHeight: viewportHeight   // and here also

   });

});

</script>

Step 3: Upload all the files to their respective folders on your server
Step 4: Done