如何在悬停而不是单击时使用 twitter 引导选项卡? [英] How to make with twitter bootstrap tabs on hover instead of clicking?

问题描述

我终于可以使用 Bootstrap 选项卡了.我想知道是否有办法改变行为，而不是单击鼠标悬停来显示隐藏的内容?

I finally got Bootstrap tabs to work. I was wondering if there's a way to change the behaviour so instead of clicking just hovering the cursor would show the hidden content?

推荐答案

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

In your $(document).ready or elsewhere ...

这样写:

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

您不必修改核心引导代码.

You wont have to modify the core bootstrap code.

另外你可以这样做:

$('.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');
});

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

Which will prevent hover selection after the first time a user clicks a tab.

这篇关于如何在悬停而不是单击时使用 twitter 引导选项卡?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！