通过视口进行qTip2智能定位

Pro*_*der 11 javascript tooltip qtip2

我有右面板,每个元素都应该有qTip.区域是可滚动的,因此低级提示不适合窗口.问题如下:

在此输入图像描述

如果我在我的工具提示中添加智能定位:

 position: {
        viewport: $('#window')
    }
Run Code Online (Sandbox Code Playgroud)

我将工具提示保留在窗口内,但现在它自动在元素的上方或下方设置位置(而不是在其左侧)并覆盖可点击元素,使其对用户不再容易.演示如下:

在此输入图像描述

问题是:如何使用保持初始位置(左)的视口(窗口)进行智能定位的工具提示?

Pro*_*der 10

得到它了.为了让它保持可见,我们可以使用adjust.此选项确定发生的视口定位的类型.如果我们把adjust:{method:none shift} - 然后tooltop,当离开可见时,不会水平移动(无)并垂直移动(移位).

有关更多选项,请阅读手册.http://qtip2.com/plugins#viewport

position: {
        at: 'center left',
        my: 'right center',
        effect: false,
        viewport: $('.mainPanel'),
        adjust: {
            method: 'none shift'
        }
    },
Run Code Online (Sandbox Code Playgroud)