better image_tag

image_tag_helper.rb

#Orverwrite the image_tag based on the idea from Designer Wall (http://webdesignerwall.com/tutorials/css3-image-styles)

def image_tag(source, options = {})
        image_width = image_height = nil
        image_width_css = image_height_css = ""

	options.symbolize_keys!

	options[:class] = "image-wrap " + options[:class]

        if size = options.delete(:size)
          options[:width], options[:height] = size.split("x") if size =~ %r{^\d+x\d+$}
        end
        image_width = options.delete(:width) if options[:width].present?
        image_height =  options.delete(:height) if options[:height].present?
        image_width_css = 'width:' + image_width + ';' if image_width
        image_height_css = 'height:' + image_height + ';' if image_height

	options[:style] = "position:relative; display:inline-block; background:url(#{super(source)}) no-repeat center center; #{image_width_css} #{image_height_css}" + options[:style]
	 
        image_html = super(source, {:style => "opacity: 0;", :width => image_width, :height => image_height})

	content_tag("span", image_html ,options)

end

#Example output
#<span class="image-wrap " style="position:relative; display:inline-block; #background:url(image.jpg) no-repeat center center; width: 150px; height: 150px;">
#	<img src="image.jpg" style="opacity: 0;">
#</span>