tabs - 如何在悬停而不是单击时使用 twitter Bootstrap 选项卡？

Question

我终于让 Bootstrap 选项卡工作了。我想知道是否有办法改变行为，而不是单击只是悬停光标会显示隐藏的内容？

Answer 1

在您的 $(document).ready或其他地方...

放这样的东西:

$('.nav-tabs > li > a').hover(function() {
  $(this).tab('show');
});

您不必修改核心 Bootstrap 代码。

此外，您可以这样做:

$('.nav-tabs > li ').hover(function() {
  if ($(this).hasClass('hoverblock'))
    return;
  else
    $(this).find('a').tab('show');
});

$('.nav-tabs > li').find('a').click(function() {
  $(this).parent()
    .siblings().addClass('hoverblock');
});

这将在用户第一次单击选项卡后阻止悬停选择。