Intro.js - 只显示一步

时间:2016-06-28 08:21:22

标签: javascript angularjs intro.js

我目前正在使用Intro.js或实际上是angular-intro.js。

我现在尝试的是你可以进行一次完整的巡演,但也只能展示一步(并且没有机会寻找另一步)。

我知道我可以使用CallMe(3)从特定步骤开始从第3步开始,我知道我可以禁用导航按钮,将showButtons设置为false。但是有没有办法同时拥有这两个,所以一个后面有CallMe()的按钮,显示完整的游览和一个带有CallMe(3)或自写功能的按钮,只显示给定的步骤?

这就是我打电话的方式:

<button class="btn btn-large btn-success" ng-click="$ctrl.CallMe();">Demo</button>
        <button class="btn btn-large btn-success" ng-click="$ctrl.CallMe(3);">Start at step 3</button>

这就是游览的定义方式:

this.IntroOptions = {
            steps: [
                {
                    element: document.querySelector('#step1'),
                    intro: "This is the first tooltip."
                },
                {
                    element: document.querySelectorAll('#step2')[0],
                    intro: "<strong>You</strong> can also <em>include</em> HTML",
                    position: 'right'
                },
                {
                    element: '.nicediv',
                    intro: 'More features, more fun.'
                },
                {
                    element: '#step4',
                    intro: "Another step.",
                    position: 'bottom'
                },
                {
                    element: '#step5',
                    intro: 'Get it, use it.'
                },
                {
                    element: '#tollesP',
                    intro: 'Scrolling of course works as well.'
                }
            ],
            showStepNumbers: false,
            showBullets: false,
            exitOnOverlayClick: true,
            exitOnEsc: true,
            nextLabel: '<strong>NEXT!</strong>',
            prevLabel: '<span style="color:green">Previous</span>',
            skipLabel: 'Exit',
            doneLabel: 'Thanks',
            showProgress: true,
            showButtons: true
        };

0 个答案:

没有答案