Bootstrap tabs - position when tab is shown?

[eappell]

I'm using introJs on a site that uses Bootstrap 3 for it's CSS. I have a particularly complex page, with several tabs displaying different information that I would like to provide an intro for. I can change tabs programmatically in the onbeforechange function, which works, but introJs doesn't know the element containing the tab content is now visible, so it positions the tooltip in the upper-left corner of the page. Is there a way to let introJs know that the element is visible, or to tell it to re-scan the DOM? If I go to the next step, then back to the tab content, it does position itself correctly, but I need it to work on the first time through... Here's how I'm switching tabs currently:

intro.onbeforechange(function (nextElement) {
    if ($(nextElement).hasClass('tab-pane')) {
        var index = $(nextElement).index();
        var tab = $(nextElement).parent().siblings('.nav-tabs').find('a')[index];
        $(tab).tab('show');
    }
});

Also, some way of providing an optional initialization event (i.e. onEnter) for each step would be awesome!

Thanks!

[kviktor]

I'm switching tabs this way and it works. (I have a menu where you navigate the tabs by clicking the links)

    intro.onbeforechange(function(target) {
      /* if the tab menu item is highlighted */
      if($(target).data("toggle") == "pill") {
        $(target).trigger("click");
      }

      /* if anything in a tab is highlighted change to that tab */
      var tab = $(target).closest('.tab-pane');
      var id = tab.prop("id");
      if(id) {
        $('a[href="#' + id + '"]').trigger("click");
      }
    });

[danielblignaut]

+1

[danielblignaut]

+1

[ediblemanager]

This works going forward, but struggles going backwards. I find that moving backwards to a previous tab means that the first element selected is highlighted but the tour element is stuck up the top left of the screen. Anyone else see this?

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.