public
Created

better image_tag

  • Download Gist
image_tag_helper.rb
Ruby
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30
#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>

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.