fullpage.js

Question

问题

当我将鼠标悬停在其中一个 .nav-fp 圆圈上时，我希望所有工具提示都显示在屏幕上。我想知道是否有一种方法可以在不覆盖 jquery.fullpage.js 文件的情况下执行此操作。

什么不起作用

我已手动尝试使用以下代码，但没有成功：

//Navigation Tooltips
$(function(eOut) {
    $(".fp-tooltip").hide();
    $("#fp-nav").hover(function() {
        $(".fp-tooltip").show();
    }, function(eOut) {
        $(".fp-tooltip").hide();
    })
});

Answer 1

仅使用 CSS 覆盖默认值怎么样：

#fp-nav ul:hover .fp-tooltip{
    right: 20px;
    transition: opacity 0.2s ease-in;
    width: auto;
    opacity: 1;
}

Example online

通过这种方式，我们告诉 fullpage.js 在悬停列表的任何部分时显示工具提示。

fullpage.js - 悬停一个圆圈时显示所有工具提示

fullpage.js - show all tooltips on hover a single circle

html

javascript

css

jquery