JQuery-鼠标悬停显示全部内容

一、效果

       跟随鼠标移动，显示内容也移动。

  <div id="MHover">我就是我，是颜色不一样的烟火！</div>  <div id="MALL"></div>

二、实现思想

      利用Jquery中mouseover、mousemove、mouseout事件，判断鼠标移动情况。

      通过Jquery中.css({})添加类中样式。

$(document).ready(function () {    $("#MALL").hide();    $("#MHover").mouseover(function(e){        document.getElementById("MALL").innerHTML=document.getElementById('MHover').innerHTML;        $("#MALL").css({"position":"absolute","top":e.pageY+5,"left":e.pageX+5}).show();    });    $("#MHover").mousemove(function(e){        document.getElementById("MALL").innerHTML=document.getElementById('MHover').innerHTML;        $("#MALL").css({"position":"absolute","top":e.pageY+5,"left":e.pageX+5});    });    $("#MHover").mouseout(function () {        $(this).next("#MALL").hide();    });});