$(document).ready(function(){
    $(".start-image-hover").titleBlock({
        removeTitle: false,
        thefontSize: "20px"
    });
});

(function($) {

    $.titleBlock = {
    
        defaults: {
            
            removeTitle: true,
            thefontSize: "20"
            
        }
            
    }
    
    $.fn.extend({
        titleBlock:function(config) {
        
            var config = $.extend({}, $.titleBlock.defaults, config);
         
            return this.each(function() {
            
                var theImage    = $(this),
                    removeTitle = config.removeTitle,
                    theFontSizeValue = config.thefontSize;
                
                theImage
                    .wrap("<div class='image'>")
                    .parent()
                    .append("<h3>&nbsp;</h3>")
                    .find("h3")
                    .html(theImage.attr('title'))
                    .wrapInner("<div style='font-size:" + theFontSizeValue + "px;'></div>")
                    //.find("br")
                    //.before("<span class='spacer'>&nbsp;</span>")
                    //.after("<span class='spacer'>&nbsp;</span>")
                    ;
                
                    
                if (removeTitle) {
                
                    theImage
                        .removeAttr("title");
                
                }

            
            })
        
        
        }
    
    })


})(jQuery);