Bootstrap标签页已经修改为鼠标滑过激活当前选项卡,怎样实现点击该链接正常跳转超链接?

  • 回答 (0)
  • 关注 (0)
  • 查看 (383)

Bootsrap 鼠标滑过 tabs 标签页自动切换激活选项卡链接,把 Bootstrap 改成鼠标滑过就激活选项卡。

<ul class="nav nav-tabs">
  <li class="active"><a href="#tab1">Home</a></li>
  <li><a href="#tab2">Profile</a></li>
  <li><a href="#tab3">Messages</a></li>
  <li><a href="#tab4">Account</a></li>
</ul>
<div class="tab-content">
  <div class="tab-pane active" id="tab1">
      TAB1 CONTENT
  </div>
  <div class="tab-pane" id="tab2">
      TAB2 OTHER CONTENT
  </div>
  <div class="tab-pane" id="tab3">
      TAB3 MORE CONTENT
  </div>
  <div class="tab-pane" id="tab4">
      TAB4 SO MUCH CONTENT
  </div>  
</div>

js

$('.nav-tabs > li').mouseover( function(){
    $(this).find('a').tab('show');
  });
  $('.nav-tabs > li').mouseout( function(){
    $(this).find('a').tab('hide');
  });

现在的问题是:选项卡需要href="#tab1"和相应的 id="tab1",才能实现切换。我想实现滑动切换选项卡,点击跳转超链接怎么实现?现在href已经被占用。我改成 <a href="https://www.baidu.com” >Home</a>,不仅不跳转,选项卡切换功能也不起作用了,

"

用户2698280用户2698280提问于

扫码关注云+社区

领取腾讯云代金券

年度创作总结 领取年终奖励