码迷,mamicode.com
首页 > 其他好文 > 详细

鼠标悬浮一定时间后显示信息

时间:2015-12-23 19:51:48      阅读:117      评论:0      收藏:0      [点我收藏+]

标签:


 


 $(".gridMore").on({"mouseenter":function(){
          showMoreInfo(this);
        },"mouseleave":function(){
          hideMoreInfo(this)
        }
      });


function
showMoreInfo(that){ var x; var y; function getPos(e){ x = e.pageX; y = e.pageY; } document.addEventListener(‘mousemove‘, getPos); 监视鼠标位置 moreInfoT = setTimeout(function(){ $("body").append("<div class=‘moreInfo‘></div>"); $(".moreInfo").html($(that).html()).css("top", y).css("left", x); //这里的that是用来指向鼠标悬浮位置的div document.removeEventListener(‘mousemove‘, getPos); }, 500); } function hideMoreInfo(){ clearTimeout(moreInfoT); $(".moreInfo").remove(); }

 

鼠标悬浮一定时间后显示信息

标签:

原文地址:http://www.cnblogs.com/ibufu/p/5070981.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!