将工具提示保留在浏览器窗口中？ （不使用插件）

我的工具提示代码如下：

HTML / CSS

a.tooltip span { display: none; padding: 5px; border: 1px solid #000; background: #999; position: absolute; color: #fff; text-align: left; } [Help]This is the tooltip 

jQuery的：

  $('a.tooltip').hover( function(e) { $(this).children('span') .css('display', 'block') .css('width', '300px') .css('left', e.pageX + 10) .css('top', e.pageY + 10).show(); }, function() { $(this).children('span').hide(); } ).click(function() { return false; }); 

这将显示位于鼠标位置+ 10（X和Y）的工具提示，但是当浏览器底部有一个工具提示并且它足够大时（并且有一些我无法更改的大工具提示） ，工具提示将延伸到浏览器窗口，使其难以查看或滚动到。 如何检查工具提示是否会延伸到浏览器窗口，然后相应地移动它？

Answer 1

不是你的问题的答案，但为什么不使用已经存在的伟大的jQuery工具提示插件之一？ 我最喜欢的是jQuery Tools 。 此示例显示了基于视图边缘与视口边缘的接近程度动态放置的实现。