使用qtip时如何避免页面滚动？

我是qTip的忠实粉丝，但我想知道是否有办法使用模态窗口而不会让页面滚动到顶部。

环顾四周但还没找到任何东西。 这可能吗？

Answer 1

对的，这是可能的！ 您需要设置调整字段

adjust : { screen : true } 

在哪里指定工具提示的位置

 position : { my : 'right center', at : 'left center', adjust : { screen : true } } 

我不确定这是否是qTip1的一个function，但我在qtip2中使用过。 自动调整工具提示以避免溢出和滚动

Answer 2

您应该将提示的目标设置为窗口，如qTip 对话框演示中所示 ：

  position: { my: 'center', at: 'center', target: $(window) } 

您也可以选择通过CSS将固定定位应用于尖端，以防止完全滚动modal dialog。 qTip自动适应所有固定定位的浏览器问题（咳嗽IE咳嗽）。 例如：

  .ui-tooltip { position: fixed; } 

或者，如果您有自己的类名：

  .ui-tooltip-myClassName { position: fixed; } 

关于提供的其他答案，请注意qTip2具有不同的视口调整格式（它不再像在qTip1中那样position.adjust.screen），并且特别允许您定义应该用于调整的包含元素：

 position: { viewport: $(window) } 

或者，对于包含元素而不是窗口/屏幕：

 position: { viewport: $('#myElement') } 

您现在还可以使用“方法”参数定义调整的方式，并且可以通过为另一个轴指定“无”来限制它仅在单个轴上进行调整。 默认/遗留方法是’flip’，但您也可以指定’shift’，它只会移动尖端以适合视口。 格式为：

 position: { viewport: $(window), adjust: { method: '' } } 

要么，

 position: { viewport: $(window), adjust: { method: ' ' } } 

例如：

 position: { viewport: $(window), adjust: { method: 'shift' } } position: { viewport: $(window), adjust: { // Only adjust tip position on the horizontal axis method: 'shift none' } }