引导浏览开始后如何关闭折叠菜单? [英] How to close the menu collapse when bootstrap tour starts?
本文介绍了引导浏览开始后如何关闭折叠菜单?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个使用"Drupal 8"和"Bootstrap 3"构建的网站.
I have a site built with "Drupal 8" and "Bootstrap 3".
启动"Tour"引导程序时如何关闭折叠的菜单?
How to close the menu collapse when bootstrap "Tour" starts ?
点击左侧菜单中的访问者",即可开始游览".
"Tour" starts by clicking on "Commencer la visite" in the left menu.
我希望单击访问者"按钮时,左右菜单会自动关闭.
I want the left and right menu to close automatically when the "Commencer la visite" button is clicked.
这是两个菜单:
id="navbar-collapse-first"
id="navbar-collapse-second"
这是我的文件tour.js的内容:
Here is the contents of my file tour.js :
(function ($, _, Drupal, drupalSettings) {
'use strict';
Drupal.behaviors.bsTour = {
attach: function (context, settings) {
$(window).on('load', function (event) {
try
{
var tourOptions = $(drupalSettings.bs_tour.tour)[0];
var tips = tourOptions.steps;
var keyboard = tourOptions.keyboard;
var debug = tourOptions.debug;
var steps = [];
for (var i = 0; i < tips.length; i++) {
if ($(tips[i].element).length > 0) {
tips[i].backdropPadding.top = parseInt(tips[i].backdropPadding.top);
tips[i].backdropPadding.right = parseInt(tips[i].backdropPadding.right);
tips[i].backdropPadding.bottom = parseInt(tips[i].backdropPadding.bottom);
tips[i].backdropPadding.left = parseInt(tips[i].backdropPadding.left);
switch (tips[i].backdrop) {
case "0":
tips[i].backdrop = false;
break;
case "1":
tips[i].backdrop = true;
break;
}
steps.push(tips[i]);
}
}
if (steps.length) {
var tour = new Tour({
debug: debug,
keyboard: keyboard,
template: "<div class='popover tour'>\
<div class='arrow'></div>\
<h3 class='popover-title'></h3>\
<div class='popover-content'></div>\
<div class='popover-navigation'>\
<button class='btn btn-default' data-role='prev'>« " + Drupal.t('Prev') + "</button>\
<span data-role='separator'>|</span>\
<button class='btn btn-default' data-role='next'>" + Drupal.t('Next') + " »</button>\
<button class='btn btn-default' data-role='end'>" + Drupal.t('Skip tour') + "</button>\
</div>\
</div>",
});
// Add steps to the tour
tour.addSteps(steps);
// Initialize the tour
tour.init();
// Start the tour
tour.start();
$('#bs-tour-restart').click(function () {
// Restart the tour
tour.init();
tour.restart();
});
// Add tour object to drupalSettings to allow manipulating tour from other modules.
// Example: drupalSettings.bs_tour.currentTour.end();
drupalSettings.bs_tour.currentTour = tour;
}
} catch (e) {
// catch any fitvids errors
window.console && console.warn('Bootstrap tour stopped with the following exception');
window.console && console.error(e);
}
});
}
};
})(window.jQuery, window._, window.Drupal, window.drupalSettings);
推荐答案
您可以尝试使用此js代码代替您的
Can you try with this js code instead yours :
$('#bs-tour-restart').click(function () {
$('#navbar-collapse-first, #navbar-collapse-second').collapse('hide');
// Restart the tour
tour.init();
tour.restart();
});
这篇关于引导浏览开始后如何关闭折叠菜单?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文