﻿(function($) {
    $.fn.extend({
        mantle: function(parms) {
            parms = jQuery.extend({
                mantleBgImage: ""
            }, parms);
            return this.each(function() {
                var img = $(this);
                img.wrap("<div id='mantleOutDiv'></div>");
                $("#mantleOutDiv").css({ 'position': 'relative'});
                img.css({ 'position': 'absolute', 'right': '0px' });
                var mantleTop = $("<div></div>");
                mantleTop.css({
                    'background-image': "url(" + parms.mantleBgImage + ")",
                    'position': 'absolute',
                    'right': '0px',
                    'z-index': '9',
                    'overflow': 'hidden',
                    'width':'100%'
                });
                one(img, mantleTop);
                img.resize(function() { mantleDiv(img, mantleTop) });
                $("#mantleOutDiv").append(mantleTop);

            });
            function one(img, Div) {
                var imgW = img.width();
                var imgH = img.height();
                var h = $(window).height() - 26;
              //  var w = imgW * h / imgH;
                Div.height(h);
            }
            function mantleDiv(img, Div) {
                var imgW = img.width();
                var imgH = img.height();
                var h = $(window).height() - 26;
                var w = imgW * h / imgH;
                Div.width(w).height(h);
            }                

        }
    });

})(jQuery); 
