问题描述
我想使用超过两页的intro.js。
它是一种简单的方法吗?
I want to use intro.js with more than two pages. Is it a simple way to do it?
推荐答案
是的,你可以。如果您查看具有多个页面的intro.js示例的代码,请您可以看到第一页的代码在用户点击按钮后重定向到第二页:
Yes, you can. If you look at code for intro.js example with multiple pages https://github.com/usablica/intro.js/tree/master/example/multi-page you can see that first page has code that redirects to second page after user click the button:
<script type="text/javascript">
document.getElementById('startButton').onclick = function() {
introJs().setOption('doneLabel', 'Next page').start().oncomplete(function() {
window.location.href = 'second.html?multipage=true';
});
};
</script>
在第二页上,我们使用正则表达式检查用户是否正在进行介绍。您需要向每个页面添加这样的代码,并将url地址添加到下一个应该显示的页面。
如果你想拥有多个介绍流程(因为问题标题说多个
),你可以给他们提供姓名或号码。然后,您可以使用 multipage = beta_version
或 multipage = 1,而不是添加
并使用reqex检查用户是否应该看到介绍,如果是,请查看是哪一个。 multipage = true
And on the second page we use regex to check if user is going through intro. You will need to add code like that to each page, with url address to the page that should be shown next. If you want to have more than one "intro flows" (since the question title said multiple
), you can give them names or numbers. Then, instead of adding multipage=true
you can use multipage=beta_version
or multipage=1
and use reqex to check if user should see intro, and if yes, which one.
<script type="text/javascript">
if (RegExp('multipage', 'gi').test(window.location.search)) {
document.getElementById('startButton').onclick = function() {
introJs().setOption('doneLabel', 'Next page')
.start().oncomplete(function() {
if (RegExp('multipage=2', 'gi').test(window.location.search)) {
window.location.href = 'third.html?multipage=2';
}
else {
window.location.href = 'unicorn.html?multipage=3';
}
});
};
}
</script>
这可能不是最好的代码:),但(如Rich说)没有更多信息我只能猜到这就是你想做的事情?但希望它会给出一个大致的想法。
That might be not the nicest code ever :), but ( like Rich said ) without more information I can only guess this is what you want to do? But hopefully, it will give a general idea.
这篇关于我可以使用超过2页的多个intro.js吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!