Intro.js: Option to change position of step number

[xSirrioNx]

Add option like "stepNumberPosition": top-left | top-right | bottom-left | bottom-right for every step.

[vivek12345]

@xSirrioNx There is already a position attribute to do the same.

[xSirrioNx]

@vivek12345 I mean not tooltip position, but Step Number position (in red circle on top-left corner of highlighted element)
For example i have element on top-left corner of the page:

So i cant't see the step number
Yes, i can change position through CSS, by changing top/left to bottom/right:

But it's not convenient if you have dozens of elements on the page and some of them aligned to the left side of page.

[assaflei]

This would help me as well

[ghenry]

Same for us. On left hand menus the step number is not visible and I don't see an option for this.

[neilandrews]

We'd love this feature too!

[nitin-jotwani]

seems like not yet fixed. I've added a temporary fix,

intro.onbeforechange(function (targetElement) {
  if (targetElement.id === 'element-id') {
    JQuery('.introjs-helperNumberLayer').addClass('introjs-stepno-top-visible')
  } else {
    JQuery('.introjs-helperNumberLayer').removeClass('introjs-stepno-top-visible')
  }
})

in your css:

.introjs-stepno-top-visible {
  top: 5px;
}

[hajimurtaza]

@bozdoz @afshinm Hi sir , can u please look at this. There also seems to be issues where when top nav elements are selected the number is shown beyond the screen. This functionality will help us bypass that

[doodhJalebi]

I'm facing the same issue. It would be nice to have official support for this.

[ponnuru]

https://github.com/usablica/intro.js/pull/335

[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.