Posted By

teedy on 10/18/09


Tagged

javascript jquery web design seo San diego reveal


Versions (?)

Cirrostratus Hover


 / Published in: jQuery
 

URL: http://cirrostratusco.com

A simple jQuery-powered hover based on the element's title

  1. $(function() {
  2.  
  3. $('.cirroHover').each(function(){
  4. var txt = $(this).attr('title');
  5. $(this).append('<em class="" style="position:absolute;background:#000;color:#fff">'+txt+'</em>');
  6. $(this).find('em').hide();
  7. });
  8.  
  9. $('.cirroHover').hover(function(){
  10. var x = $(this).offset().left;
  11. var y = $(this).offset().top;
  12. $(this).find('em').css({top: ((y*1)+12)+'px', left: x+'px'}).show('fast');
  13. return false;
  14. });
  15. $('.cirroHover').mouseleave(function(){
  16. $(this).find('em').hide('fast');
  17. });
  18. });

Report this snippet  

You need to login to post a comment.