手动定位调整qtip工具提示(不工作)

Ton*_*bet 5 css jquery position qtip

 $('#nav a[href][title]').qtip({
      content: {
         text: false // Use each elements title attribute
      },
      position: {
     corner: {
        target: 'topLeft',
        tooltip: 'middleRight'
                }
                },
     style: {
       name: 'dark',
       width: 230,
       padding: 3,
       bottom: 10,
       textAlign: 'center'
      }
 // Give it some style
   });
Run Code Online (Sandbox Code Playgroud)

我想模拟:css:position:relative; bottom:10px所以工具提示与目标垂直对齐(见图),但我无法完成它

在此输入图像描述

这样试试

$('#nav a[href][title]').qtip({
      content: {
         text: false // Use each elements title attribute
      },
      position: {
     corner: {
        target: 'topLeft',
        tooltip: 'middleRight'
                }
                },
     style: {
       name: 'dark',
       width: 230,
       padding: 3,
       position: 'relative',
       bottom: 10,
       textAlign: 'center'
      }
 // Give it some style
   });
Run Code Online (Sandbox Code Playgroud)

但是工具提示的文本被移动了,而不是工具提示本身,

我怎样才能做到这一点?

编辑

尝试'调整'属性,但有一个我找不到的语法错误

$('#nav a[href][title]').qtip({
      content: {
         text: false // Use each elements title attribute
      },
      position: {

      adjust: {
              x: 10px,
              y: 10px
       },

     corner: {
               target: 'topLeft',
               tooltip: 'middleRight'
                }
     },
     style: {
       name: 'dark',
       width: 230,
       padding: 3,
       textAlign: 'center'
      },
 // Give it some style
   });
Run Code Online (Sandbox Code Playgroud)

Dim*_*tri 14

您可以使用"position"属性组的"adjust"属性,如下所示:

position: {
    corner: {
        target: 'topLeft',
        tooltip: 'middleRight'
        },
    adjust: {
        x: 10,
        y: 10
        }
    }
Run Code Online (Sandbox Code Playgroud)

我提供的数字是任意的.您可以随意使用它们来定位.

  • 你在使用qtip或qtip2吗?他们已经发布了qtip2,旧版本很快就会过时了.不需要重写,只需下载qtip2 js文件并用它替换旧文件.至于调整,我的坏,你不需要px,只使用没有引号的普通数字. (3认同)