我试图从AjaxControlToolkit中编写一个jQuery相当于HoverMenuExtender,这样当我将鼠标悬停在元素上时,我可以显示包含某些上下文相关的div帮帮我。在没有滚动偏移的情况下悬停时显示元素
我可以做这项工作时,第一次加载页面(鼠标悬停在第一个帮助符号):
但是当页面滚动下来,DIV是垂直滚动的偏移量(想必如果我有水平滚动它会移到右边太)(鼠标依然徘徊在第一帮助符号):
我jQuery是:
$('.hoverHelpAnchor').hover(function (e)
{
$(this).next().show().css('left', e.pageX).css('top', e.pageY);
}
, function()
{
$(this).next().hide();
});
CSS是:
.hoverHelp
{
display: none;
background-color: White;
border-style: solid;
border-width: thin;
border-color: Black;
width: 200px;
z-index: 10000;
position: fixed;
margin: 2;
}
和我的标记是:
<img src="@Url.Content("~/Content/images/help.png")" class="hoverHelpAnchor" alt="" />
<div class="hoverHelp">
Project Name help blah blah blah very very very very very very very very long string that I want to word-wrap
</div>
我会很感激,如果有人能指出什么我缺少以占页面滚动所以DIV不会出现在偏移位置。
也许你可以从jQuery的用户界面的提示中的地位位置虽然你没有使用jquery-ui http://jqueryui.com/demos/position/#default – Willy