javascript - 工具提示出现在 intro.js 移动 View 中的元素上方

Question

我正在使用 intro.js 初步浏览我网站上的页面。该游览在桌面上看起来不错，但在移动设备上，工具提示出现在它所描述的元素的正上方。用户无法在移动 View 中看到该元素，因为工具提示出现在该元素的正上方。见下图:

我尝试自定义工具提示的位置，但输出保持不变。我用来自定义位置的脚本给出:

var tour = introJs();
tour.setOption('positionPrecedence', ['top', 'bottom', 'left', 'right']);

此外，我看不到工具提示上方的数据步骤数。桌面版不存在此类问题。

有人可以解释一下问题是什么吗？ 提前致谢!

Answer 1

以下 CSS 共同帮助我解决了该问题:

@media (max-width: 500px) { 
    .introjs-helperNumberLayer{
        left: 0px!important;
        top: -10px!important;
    }
    .introjs-tooltip{
        margin-top: 40px!important;
    }
}