jquery - 控制单选组的工具提示工具提示位置

Question

我设置了工具提示程序来显示我的验证消息，到目前为止，除了一种情况外，它们运行良好。我有一组单选按钮，并且必须从“是/否”中选择"is"。因此，我为此设置了一个 jquery 验证方法。当我通过 firebug 进行调试时，我可以看到验证正在发生，但闪烁的消息位于是选项，它完全掩盖了否选项，因为它位于其之上。

这是它的样子

这是我的工具提示配置如何查找单选按钮

$('#iWatchEnabled').tooltipster({
    trigger: 'custom', // default is 'hover' which is no good here
    onlyOne: false,    // allow multiple tips to be open at a time
    position: 'right',  // display the tips to the right of the element
    theme: '.tooltipster-shadow',
    left:' 850px'

});

最后一个左边:'850px' 是试图覆盖我通过 firebug 看到的位置。

这是单选按钮工具提示的 Firebug 详细信息

<div class="tooltipster-base tooltipster-shadow tooltipster-fade tooltipster-fade-show" style="transition-duration: 350ms; animation-duration: 350ms; width: 298px; padding-left: 0px; padding-right: 0px; top: 125.5px; left: 675px;">
<div class="tooltipster-content">Application has to be onboarded as a pre-requisite</div>
<div class="tooltipster-arrow-right tooltipster-arrow" style="">
<span style="border-color:rgb(236, 236, 236);"></span>
</div>
</div>

解决这个问题的任何帮助都会很棒。这看起来似乎是一个微不足道的问题，但我花了相当长的时间来尝试解决这个问题，但没有任何结果。

Answer 1

终于找到答案了

看来我的第一个设置也覆盖了我的 radio 组设置。

$('#onboardForm input').tooltipster({
    trigger: 'custom', // default is 'hover' which is no good here
    onlyOne: false,    // allow multiple tips to be open at a time
    position: 'right',  // display the tips to the right of the element
    theme: '.tooltipster-shadow'
});

$('#onboardForm input:radio').tooltipster({
    trigger: 'custom', // default is 'hover' which is no good here
    onlyOne: false,    // allow multiple tips to be open at a time
    position: 'right',  // display the tips to the right of the element
    theme: '.tooltipster-shadow',
    offsetX: 100
});

我添加了一个偏移量，但是我必须为其他文本字段设置单独的样式我就是这么做的

$('#onboardForm input:text').tooltipster({
    trigger: 'custom', // default is 'hover' which is no good here
    onlyOne: false,    // allow multiple tips to be open at a time
    position: 'right',  // display the tips to the right of the element
    theme: '.tooltipster-shadow'
});

$('#onboardForm input:radio').tooltipster({
    trigger: 'custom', // default is 'hover' which is no good here
    onlyOne: false,    // allow multiple tips to be open at a time
    position: 'right',  // display the tips to the right of the element
    theme: '.tooltipster-shadow',
    offsetX: 100
});

请注意，我在第一个配置中添加了 :text 以表明该样式仅适用于 input type="text"元素在第二个配置(对于我的单选按钮)中，我添加了一个 offsetX 并将其移开大约 100 px