javascript - jQuery Image Hover on top of multiple dynamic images -

ok have full table of images , want display small icon on bottom right of every image on hover. ideas how this? right have this, , showing hover image in same spot every time...it needs show on top of image hovered. thanks!

.enlargeimage { background:url(images/xxx) no-repeat; position:absolute; width:16px; height:14px; z-index:200; display:none; }  $('.table_imagethumbs a').mouseover(function(){             $(this).show('.enlargeimage');         });   <div class="enlargeimage"></div>  <table width="408" class="table_imagethumbs">                   <tr>                     <td width="102" class="td_thumb"><a><image width="75" height="97" class="img_vertthumb"></a></td>                     <td width="102"><a><image width="75" height="97" class="img_vertthumb"></a></td>                     <td width="102"><a><image width="75" height="97" class="img_vertthumb"></a></td>                     <td width="102"><a><image width="75" height="97" class="img_vertthumb"></a></td>                   </tr> </table> 

i use jquery dynamically append .enlargeimage element after a tag that´s being hovered on , give table cells position: relative , .enlargeimage right: 0; bottom: 0. you´d have remove div again on mouseout (when hover ends).

however, have read somewhere here there possible problems absolute positioning inside table cells (can´t find right now...) might not work expected.

some untested example code:

el = $("<div>")      .addclass("enlargeimage");  $('.table_imagethumbs a').hover(   function() {     el.appendto(this);   },   function() {     el.remove();   });