(function($) {

    $.fn.corners = function(options) {

        //make sure image ids are unique
        var counter = 0;
        var rand = Math.random();


        if (options){

            this.each(function(key, image){

                $(image).css({
                    position : 'relative'
                });

                //create top left overlay
                var topLeft = new Image();
                topLeft.src = options.topLeft;
                topLeft.id = 'topLeft' + rand + '_' + counter;

                //create top right overlay
                var topRight = new Image();
                topRight.src = options.topRight;
                topRight.id = 'topRight' + rand + '_' + counter;

                //create bottom right overlay
                var bottomRight = new Image();
                bottomRight.src = options.bottomRight;
                bottomRight.id = 'bottomRight' + rand + '_' + counter;

                //create bottom left overlay
                var bottomLeft = new Image();
                bottomLeft.src = options.bottomLeft;
                bottomLeft.id = 'bottomLeft' + rand + '_' + counter;


                /*
			 * Insert images first then use ids to get prototype extensions
			 * due to problems in ie 7 and below
			 */

                //insert images
                $(image).append(topLeft);
                $(image).append(topRight);
                $(image).append(bottomRight);
                $(image).append(bottomLeft);

                $(topLeft).css({
                    position : 'absolute',
                    top : '0px',
                    left : '0px',
                    'z-index' : 5
                });

                $(topRight).css({
                    position : 'absolute',
                    top : '0px',
                    right : '0px',
                    'z-index' : 5
                });

                $(bottomRight).css({
                    position : 'absolute',
                    bottom : '0px',
                    right : '0px',
                    'z-index' : 5
                });

                $(bottomLeft).css({
                    position : 'absolute',
                    bottom : '0px',
                    left : '0px',
                    'z-index' : 5
                });

                counter++;
            });
        }
    }
})(jQuery);

