alt text not showing when hovering over image

Question

i have the following code:

<td><%= link_to(image_tag("delete.gif", :size => "16x16", :alt => "Delete Entry"), phone, :confirm => 'Are you sure?', :method => :delete, :remote=>true, :class=>'delete_phone') %></td>  

in my view. Now, it all works fine and does what I need it to, but when I hover over the icon, well, it doesn't show me any text. I've tried in Firefox and Chrome.

Has anyone else come across the same issue?

Thanks!

Answer 1

#protip - it can be a painful (and very un-DRY) exercise to add titles for all your images. To make this a lot less painful all my apps ship with this JS (require jquery):

$(function() {
  $('img').each( function() {
    var o = $(this);
    if( ! o.attr('title') && o.attr('alt') ) o.attr('title', o.attr('alt') );
  });
});

This sets the title of any img without a title to the value of it's alt attribute.

Answer 2

Use title, not alt, and your problems will be solved! Alt is for accessibility - it means "alternate". Title is what you'd use for a tooltip.

Answer 3

On hover image title text is shown in tooltip.

Alt text is for users with disabled images (or slow connection) and search engines