Question

我刚刚玩这个名为jBox.js的插件，并遇到了一些新选项。这是一个非常可定制的插件。我所说的选项是adjustDistance。

documentation表示，你可以传入一个整数或对象，如下所示：

$(function(){
          $('.tooltip').jBox('Tooltip', {
              trigger: 'click',
              adjustDistance : {
                top : 15,
                bottom : 15,
                left : 15,
                right : 50
              }
          });
      });

我做到了，但我发现工具提示的呈现方式没有任何差异，只需 FIDDLE HERE 。

文档描述了此选项，如下所示：

应开始调整时与窗口边缘的距离。使用对象设置不同的值，例如{top：50，right：20，bottom：5，left： 20}

但我不太明白它的用法。谁能解释一下？

Answer 1

如果我们给adjustDistance说10，当任何窗口边缘在工具提示的10px距离内时，工具提示将尝试调整（重新定位）。您也可以为窗口的不同边缘提供自定义值。

这个例子会说清楚：

示例1：

$(function(){
      $('.tooltip').jBox('Tooltip', {
          trigger: 'click',
          adjustDistance : {
            top : 15,
            bottom : 15,
            left : 15,
            right : 50
          }
      });
  });

示例2（更改adjustDistance底部的值）：

$(function(){
      $('.tooltip').jBox('Tooltip', {
          trigger: 'click',
          adjustDistance : {
            top : 15,
            bottom : 150,
            left : 15,
            right : 50
          }
      });
  });

对于它们两者，尝试单击按钮打开工具提示，然后调整从底部收缩的窗口大小，以便工具提示需要重新调整。

了解jBox配置选项

1 个答案: