我正在使用这个很棒的引导插件BootstrapTour
我在我的引导选项卡上使用它。
这是它现在的样子：
如您所见，它位于选项卡面板中。
我现在想要实现的是包含“基本信息”标题。
看起来像这样的东西：
问题是我不知道如何实现这一目标。
我的代码是这样的：
<div role="tabpanel" style="margin-top:30px;">
<!-- Nav tabs -->
<ul class="nav nav-tabs" id="cp-tabs" role="tablist">
<li role="presentation" class="active"><a href="#basicInfo" aria-controls="basicInfo" role="tab" data-toggle="tab">Basic Information</a></li>
<li role="presentation"><a href="#clients" aria-controls="clients" role="tab" data-toggle="tab">Clients</a></li></a></li>
</ul>
<div class="tab-content" id="tabContent">
<div role="tabpanel" class="tab-pane fade in active" id="basicInfo">... ... </div>
<div role="tabpanel" class="tab-pane fade agency_content" id="clients">
</div>
</div>
我的初始化引导程序之旅的 JS 文件：
var tour = new Tour({
storage:false,
steps: [
{
element: "#btn_add_client",
title: "Add a Client",
content: "Hello There! <br />Welcome to 2020 Dashboard!<br />You can start by adding your client.<br />Don't be shy and click the Add a Client button to get started and we’ll walk you through it.",
placement:'left'
},
{
//element: "#cp-tabs li:first-child",
element: "#basicInfo",
title: "Your Basic Information",
content: "This is your account information for 2020Dashboard. You can access it anytime from the Control Panel.",
placement: 'top',
backdropPadding: "15px",
onShown:function(tour){
jQuery(".tour-step-background").css("height","0px");
jQuery("#basicInfo").css("background","white");
jQuery('.nav-tabs a[href="#basicInfo"]').tab('show');
}
},
{
element: "#cp-tabs li:nth-child(2)",
title: "Clients List",
content: "Here is the list of the clients your agency is managing. You can access their basic info and add or updated connected accounts from their control panel pages.",
onShown:function(tour){
jQuery('.nav-tabs a[href="#clients"]').tab('show');
}
},
{
element: "#search-dropdown",
title: "Client Selection Tool",
content: "When you're ready to start looking at data, select the client you want to manage from this dropdown."
},
{
element: "#supportBtnLi",
title: "Help",
content: "Click here if you need more help.",
placement: "bottom"
}
],
backdrop:true
});
请问有什么想法吗？
谢谢！