(function(){
     
    /**
    CONFIGURATION:
    Define the size of our background image
    */
    var bgImageSize = {
    width: 640,
    height: 426
    };
     
    /*END CONFIGURATION */
     
    /**
    Detect support for CSS background-size. No need for any more javascript if background-size is supported.
    Property detection adapted from the most excellent Modernizr <http://modernizr.com>
    */
    if ((function(){
    var el = document.createElement('div'),
    bs = 'backgroundSize',
    ubs= bs.charAt(0).toUpperCase() + bs.substr(1),
    props= [bs, 'Webkit' + ubs, 'Moz' + ubs, 'O' + ubs];
     
    for ( var i in props ) {
    if ( el.style[props[i]] !== undefined ) {
    return true;
    }
    }
    return false;
    }())) {
    return;
    };
     
    /**
    We also want to leave IE6 and below out in the cold with this
    */
    if ( false /*@cc_on || @_jscript_version < 5.7 @*/ ) {
    return;
    }
     
    /**
    If we've gotten here, we don't have background-size support,
    so we'll have to mimic it with Javascript.
    Let's set up some variables
    */
    var elBody,
    imageID= 'expando',
    tallClass= 'tall',
    wideClass= 'wide',
    elBgImage, elWrapper, img, url, imgAR,
     
    /**
    Since we're not relying on a library, we'll need some utility functions
    First, basic cross browser event adders
    */
    addEvent = function(el, evnt, func) {
    if (el.addEventListener) {
    el.addEventListener(evnt, func, false);
    } else if (el.attachEvent) {
    return el.attachEvent("on" + evnt, func);
    } else {
    el['on' + evnt] = func;
    }
    },
     
    domLoaded = function(callback) {
    /* Internet Explorer */
    /*@cc_on
    @if (@_win32 || @_win64)
    document.write('<script id="ieScriptLoad" defer src="//:"><\/script>');
    document.getElementById('ieScriptLoad').onreadystatechange = function() {
    if (this.readyState == 'complete') {
    callback();
    }
    };
    @end @*/
    /* Mozilla, Chrome, Opera */
    if (document.addEventListener) {
    document.addEventListener('DOMContentLoaded', callback, false);
    }
    /* Safari, iCab, Konqueror */
    if (/KHTML|WebKit|iCab/i.test(navigator.userAgent)) {
    var DOMLoadTimer = setInterval(function () {
    if (/loaded|complete/i.test(document.readyState)) {
    callback();
    clearInterval(DOMLoadTimer);
    }
    }, 10);
    }
    },
     
    /**
    Next, a way to properly get the computed style of an element
    Courtesy of Robert Nyman - http://robertnyman.com/2006/04/24/get-the-rendered-style-of-an-element/
    */
    getStyle = function(el, css){
    var strValue = "";
    if (document.defaultView && document.defaultView.getComputedStyle){
    strValue = document.defaultView.getComputedStyle(el, "").getPropertyValue(css);
    }
    else if (el.currentStyle){
    css = css.replace(/\-(\w)/g, function (strMatch, p1){
    return p1.toUpperCase();
    });
    strValue = el.currentStyle[css];
    }
    return strValue;
    },
     
    /**
    Finally, some element class manipulation functions
    */
    classRegex = function(cls) {
    return new RegExp('(\\s|^)'+cls+'(\\s|$)');
    },
     
    hasClass = function(el, cls) {
    return el.className.match(classRegex(cls));
    },
     
    addClass = function(el, cls) {
    if ( ! hasClass(el, cls)) {
    el.className += ' ' + cls;
    }
    },
     
    removeClass = function(el, cls) {
    if (hasClass(el, cls)) {
    el.className = el.className.replace(classRegex(cls), '');
    }
    },
     
    /*
    Now we can move on with the core functionality of Flexibackground
    */
    initialize = function() {
     
    // No need for any of this if the screen isn't bigger than the background image
    if (screen.availWidth <= bgImageSize.width && screen.availHeight <= bgImageSize.height) {
    return;
    }
     
    // Grab elements we'll reference throughout
    elBody= document.getElementsByTagName('body')[0];
     
    // Parse out the URL of the background image and drop out if we don't have one
    url = getStyle(elBody, 'backgroundImage').replace(/^url\(("|')?|("|')?\);?$/g, '') || false;
    if (!url || url === "none" || url === "") {
    return;
    }
     
    // Get the aspect ratio of the image
    imgAR = bgImageSize.width / bgImageSize.height;
     
    // Create a new image element
    elBgImage = document.createElement('img');
    elBgImage.src = url;
    elBgImage.id = imageID;
     
    // Create a wrapper and append the image to it.
    // The wrapper ensures we don't get scrollbars.
    elWrapper = document.createElement('div');
    elWrapper.style.overflow= 'hidden';
    elWrapper.style.width= '100%';
    elWrapper.style.height= '100%';
    elWrapper.style.zIndex= '-1';
     
    elWrapper.appendChild(elBgImage);
    elBody.appendChild(elWrapper);
     
    // Fix the wrapper into position
    elWrapper.style.position= 'fixed';
    elWrapper.style.top= 0;
    elWrapper.style.left= 0;
     
    // Set up a resize listener to add/remove classes from the body
    addEvent(window, 'resize', resizeAction);
     
    // Set it up by triggering a resize
    resizeAction();
     
    },
     
    /**
    Set up the action that happens on resize
    */
    resizeAction = function() {
    var win = {
    height: window.innerHeight || document.documentElement.clientHeight,
    width: window.innerWidth || document.documentElement.clientWidth
    },
     
    // The current aspect ratio of the window
    winAR = win.width / win.height;
     
    // Determine if we need to show the image and whether it needs to stretch tall or wide
    if (win.width < bgImageSize.width && win.height < bgImageSize.height) {
    removeClass(elBody, wideClass);
    removeClass(elBody, tallClass);
    } else if (winAR < imgAR) {
    removeClass(elBody, wideClass);
    addClass(elBody, tallClass);
    // Center the image
    elBgImage.style.left = Math.min(((win.width - bgImageSize.width) / 2), 0);
    } else if (winAR > imgAR) {
    addClass(elBody, wideClass);
    removeClass(elBody, tallClass);
    elBgImage.style.left = 0;
    }
    };
     
    // When the document is ready, run this thing.
    domLoaded(initialize);
     
    })();