Bootstrap Tour仅在我滚动页面时加载

时间:2017-10-09 07:44:30

标签: javascript jquery bootstrap-tour

我对https://support.google.com/mail/acco有疑问。

我的问题

当我从一个页面重定向到另一个页面时,将调用init函数,但不会自动继续游览。因此,不会显示引导程序。该页面还包含一个AJAX框架,其中的内容将在document.ready之后加载。

当我稍微滚动页面时,在加载AJAX框架后,游览会突然显示。

代码

var quick_tour = undefined, initialized = false;
$(document).ready(function () {
    setupTour();
});

function setupTour() {
    quick_tour = new Tour({
        name: "quick_tour",
        storage: window.localStorage,
        steps: [
            {
                element: "#news_container",
                title: "Part 1",
                content: "This is the Text number 1",
                path: ""
            },
            {
                element: "#brand_title",
                title: "Part 2",
                placement: "bottom",
                content: "And this is number 2",
                path: "second.php"
            },
        ],
    });
    initTour();
}

function initTour() {
    if (!initialized) {
        if (quick_tour === undefined) {
            setupTour();
        }
        quick_tour.init();
        initialized = true;
    }
}

function startTour() {
    quick_tour.restart();
}

因此,在我点击调用函数#news_container的按钮后,将直接显示第1部分的startTour()。然后在第一部分之后,它将被重定向到第二页。现在,仅当我滚动时,才会显示巡视。

我该怎么办?我可以创建一个触发器来滚动页面吗?

谢谢。

1 个答案:

答案 0 :(得分:4)

在我尝试使用事件触发器$(window).scroll();之后,我终于自己解决了这个问题。现在我刚刚更新了initTour函数:

function initTour() {
    if (quick_tour === undefined) {
        setupTour();
    }
    quick_tour.init();
    $(window).scroll(); //Performs an scroll
}