标签：function return 鼠标 Geometry tooltip 弹出 Tooltip document

Geometry.js

var Geometry = {};

if (window.screenLeft) 
{
  Geometry.getWindowX = function()
  {
    return window.screenLeft;
  };
  Geometry.getWindowY = function()
  {
    return window.screenTop;
  };
}
else 
  if (window.screenX) 
  {
    Geometry.getWindowX = function()
    {
      return window.screenX;
    };
    Geometry.getWindowY = function()
    {
      return window.screenY;
    };
  }

if (window.innerWidth) 
{
  Geometry.getViewportWidth = function()
  {
    return window.innerWidth;
  };
  Geometry.getviewportHeight = function()
  {
    return window.innerHeight;
  };
  Geometry.getHorizontalScroll = function()
  {
    return window.pageXOffset;
  };
  Geometry.getVerticalScroll = function()
  {
    return window.pageYOffset;
  };
}
else 
  if (document.documentElement && document.documentElement.clientWidth) 
  {
    Geometry.getViewportWidth = function()
    {
      return document.documentElement.clientWidth;
    };
    Geometry.getviewportHeight = function()
    {
      return document.documentElement.clientHeight;
    };
    Geometry.getHorizontalScroll = function()
    {
      return document.documentElement.scrollLeft;
    };
    Geometry.getVerticalScroll = function()
    {
      return document.documentElement.scrollTop;
    };
  }
  else 
    if (document.body.clientWidth) 
    {
      Geometry.getViewportWidth = function()
      {
        return document.body.clientWidth;
      };
      Geometry.getviewportHeight = function()
      {
        return document.body.clientHeight;
      };
      Geometry.getHorizontalScroll = function()
      {
        return document.body.scrollLeft;
      };
      Geometry.getVerticalScroll = function()
      {
        return document.body.scrollTop;
      };
    }

if (document.documentElement && document.documentElement.scrollWidth) 
{
  Geometry.getDocumentWidth = function()
  {
    return document.documentElement.scrollWidth;
  };
  Geometry.getDocumentHeight = function()
  {
    return document.documentElement.scrollHeight;
  };
}
else 
  if (document.body.scrollWidth) 
  {
    Geometry.getDocumentWidth = function()
    {
      return document.body.scrollWidth;
    };
    Geometry.getDocumentHeight = function()
    {
      return document.body.scrollHeight;
    };
  }

Tooltip.js

Tooltip.X_OFFSET = 25;
Tooltip.Y_OFFSET = 15;
Tooltip.DELAY = 500;
Tooltip.Text;
function Tooltip()
{
  this.tooltip = document.createElement("div");//create div for shadow
  this.tooltip.style.position = "absolute";//
  this.tooltip.style.visibility = "hidden";
  this.tooltip.className = "tooltipShadow";

  this.content = document.createElement("div");//create div for content
  this.content.style.position = "relative";
  this.content.className = "tooltipContent";

  this.tooltip.appendChild(this.content);
}

Tooltip.prototype.show = function(text, x, y)
{
  this.content.innerHTML = text;
  this.tooltip.style.left = x + "px";
  this.tooltip.style.top = y + "px";
  this.tooltip.style.visibility = "visible";

  if (this.tooltip.parentNode != document.body) 
    document.body.appendChild(this.tooltip);
};


Tooltip.prototype.hide = function()
{
  this.tooltip.style.visibility = "hidden";
};


Tooltip.prototype.schedule = function(target, e)
{

  var text = Tooltip.Text;
  if (!text) 
    return;

  var x = e.clientX + Geometry.getHorizontalScroll();
  var y = e.clientY + Geometry.getVerticalScroll();

  x += Tooltip.X_OFFSET;
  y += Tooltip.Y_OFFSET;

  var self = this;
  var timer = window.setTimeout(function()
  {
    self.show(text, x, y);
  }, Tooltip.DELAY);

  if (target.addEventListener) 
    target.addEventListener("mouseout", mouseout, false);
  else 
    if (target.attachEvent) 
      target.attachEvent("onmouseout", mouseout);
    else 
      target.onmouseout = mouseout;

  function mouseout()
  {
    self.hide();
    window.clearTimeout(timer);

    if (target.removeEventListener) 
      target.removeEventListener("mouseout", mouseout, false);
    else 
      if (target.detachEvent) 
        target.detachEvent("mouseout", mouseout);
      else 
        target.onmouseout = null;
  }
};

Tooltip.tooltip = new Tooltip();


Tooltip.schedule = function(target, e)
{
  Tooltip.tooltip.schedule(target, e);
}

Tooltip.init = function(value){Tooltip.Text = value};

.tooltipShadow {
    background-color:#A9A9A9;
}
.tooltipContent {
    left:-4px;
    top:-4px;
    background-color:#F0F8FF;
    border:solid black 1px;
    padding:5px;
    font:9pt sans-serif;
    color:#0000CC;
    width:150px;
}

使用：

在jsp需要提示的地方加入οnmοusemοve="Tooltip.schedule(this,event)"
js中要设置提示的内容Tooltip.init("提示的内容");

标签：function,return,鼠标,Geometry,tooltip,弹出,Tooltip,document
来源： https://www.cnblogs.com/springsnow/p/12367017.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。