根据鼠标的位置动态的控制层的位置

复制代码 代码如下:

  <script>

  var index=0; //鼠标第一次点击时候显示,鼠标再次点击将层不在显示

  /**

  * 鼠标点击事件

  *bizData:传递的参数

  */

  function search(bizData)

  {

  if(index==0)

  {

  if(bizData==null) //当参数为空的时候该层内容清空,不让其显示null

  {

  $("bizDiv").innerText = "";

  $("bizDiv").style.background='#99FFFF';

  document.onclick = mouseMove;

  index++;

  }else

  {

  $("bizDiv").innerText = bizData;

  $("bizDiv").style.background='#99FFFF'; //相对的页面的颜色设置

  document.onclick = mouseMove; //点击触发事件

  index++;

  }

  }else{ //第二次鼠标点击

  $("bizDiv").innerText = "";

  document.onclick = mouseMove;

  $("bizDiv").style.background='transparent'; //将层的背景颜色设置为“透明色”

  index=0;

  }

  }

  /*

  *鼠标移动事件,获取层的top,right的位置

  */

  function mouseMove(ev)

  {

  ev= ev || window.event;

  var mousePos = mouseCoords(ev);

  $("bizDiv").style.right = document.body.clientWidth-mousePos.x+15;

  $("bizDiv").style.top = document.body.clientHeight-200;

  $("bizDiv").style.width='200';

  //$("bizDiv").style.hight='200';

  }

  /*

  *获取鼠标的位置

  */

  function mouseCoords(ev)

  {

  if(ev.pageX || ev.pageY){

  return {x:ev.pageX, y:ev.pageY};

  }

  return {

  x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,

  y:ev.clientY + document.body.scrollTop - document.body.clientTop

  };

  }

  </script>