search

DaftMonk / angular-tour

AngularJS directive for giving an interactive tour of your website.
http://daftmonk.github.io/angular-tour/
MIT License
609 stars 137 forks source link

Tour ToolTip not visible when element has overflow: hidden #30

Open chubbard opened 9 years ago

chubbard commented 9 years ago

I have several elements that have overflow hidden or contained within something with overflow hidden marked on them and if I add the tooltip-step to them angular-tour adds the tooltip popup as a child of that container and the popup is not visible hence the tour cannot be continued. Since you're going through the trouble to position the tooltip anyway there's no need to add it to that container. It could just be added globally or at least at the level of the tour element and moved into position using your existing positioning mechanism. Unfortunately because of this I can't use angular-tour

mindjuice commented 9 years ago

I have a similar issue, but with z-index. Due to stacking context issues, sometimes it is impossible for the tour tip to be on top and it gets obscured by other HTML elements.

For this reason and chubbard's reason above, adding tour elements in the middle of the HTML is fundamentally the wrong thing to do, and makes this otherwise interesting package unusable for many use cases, including mine.

You can read about z-index and stacking contexts here:

http://philipwalton.com/articles/what-no-one-told-you-about-z-index/

"Angular intro", which is just an angular wrapper over intro.js, looks like it puts everything at the end of the HTML, so I'm going to give that a try now.

yhnavein commented 9 years ago

Check out #28

In my PR I've introduced way to deal with it.