Open a specific tab with cbpFWTabs(使用 cbpFWTabs 打开特定选项卡)
问题描述
我正在使用 cbpFWTabs (http://tympanus.net/Development/TabStylesInspiration/) 但是想要在页面加载时打开特定的标签.我试图在页面中模拟这样的 show 方法,但它无法识别选项卡或项目数组:
I am using cbpFWTabs (http://tympanus.net/Development/TabStylesInspiration/) but want to open a specific tab upon page load. I have tried to emulate the show method like this in the page but it doesn't recognize the tabs or items arrays:
<script type="text/javascript">
// tabs elems
this.tabs = [].slice.call( this.el.querySelectorAll( 'nav > ul > li' ) );
// content items
this.items = [].slice.call( this.el.querySelectorAll( '.content-wrap > section' ) );
if( this.current >= 0 ) {
this.tabs[ this.current ].className = this.items[ this.current ].className = '';
}
// change current
this.current = idx != undefined ? idx : this.options.start >= 0 && this.options.start < this.items.length ? this.options.start : 0;
this.tabs[ this.current ].className = 'tab-current';
this.items[ this.current ].className = 'content-current';
};
tabIndex = 1;
showTab(tabIndex);
</script>
标签源码在这里:https://github.com/codrops/FullWidthTabs/blob/master/js/cbpFWTabs.js
我确定一定有更简单的方法?
I am sure there must be an easier way?
推荐答案
结果比我想象的要简单——只需调用锚点上的点击事件:
It turned out to be easier than I thought -- simply invoke the click event on the anchor:
$('#settings-section')[0].click();
并向锚点添加一个 id:
And adding an id to the anchor:
<li><a id="settings-section" href="#section-bar-2" class="icon icon-box"><span>Settings</span></a></li>
这篇关于使用 cbpFWTabs 打开特定选项卡的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:使用 cbpFWTabs 打开特定选项卡
基础教程推荐
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01
- Chart.js 在线性图表上拖动点 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01
- 直接将值设置为滑块 2022-01-01