我有一个为bootstraptour创建的自定义脚本,我想用自己的自定义展示位置覆盖bootstraptours的原始“顶部”展示位置。有没有一种方法可以在Bootstraptour中定义工具提示的多个位置?
bootstrap-tour-standalone.js中的默认代码为:
Tooltip.DEFAULTS = {
animation: true,
placement: 'top', //Default
selector: false,
template: '<div class="tooltip" role="tooltip"></div>',
container: false
}
我的自定义脚本代码是:
'use strict';
$(function () {
var steps = [];
var leadIndex = 0;
function gensteps(index, div, message, template) {
var id = $(div).attr('id');
if (id === undefined) {
$(body).attr('id', 'id_' + leadIndex + '_' + index);
id = $(div).attr('id');
}
var step = {
element: '#' + id,
placement: 'top',
content: message,
backdropElement: '#client-activated-update-client-info'
};
steps.push(step);
}
leadIndex++;
placement: 'left'; //I would like for this tooltip to overwrite default top placement and move to the left
$('#Address1').each(function (index, div) {
var template = '<div class="popover" role="tooltip"> <div class="arrow"></div> <div class="popover-content"></div> <div class="popover-navigation"> <div class="btn-group-custom"> <button class="tip-skip-button">Next</button> </div> <button class="tip-exit" data-role="end">Exit</button> </div> </div>';
gensteps(index, div, '<h3 class="tool-tip-title">Review/Update Your Address</h3>\n <div class="tip-content">\n </div>', template);
});
leadIndex++;
placement: 'right'; //I would like for this tooltip to overwrite default top placement and move to the right
$('#Address2').each(function (index, div) {
var template = '<div class="popover" role="tooltip"> <div class="arrow"></div> <div class="popover-content"></div> <div class="popover-navigation"> <div class="btn-group-custom"> <button class="tip-skip-button">Next</button> </div> <button class="tip-exit" data-role="end">Exit</button> </div> </div>';
gensteps(index, div, '<h3 class="tool-tip-title">Review/Update Your Address</h3>\n <div class="tip-content">\n </div>', template);
});
var tour = new Tour({
steps: steps
});tour.init();tour.start(true);
tour.goTo(0);
});
如您所见,在我的第一个目标(#Address1)中,我试图将工具提示定位在左侧,在我的下一个目标(#Address2)中,我想将工具提示定位在右侧,但它不起作用。