This repository has been archived by the owner on May 29, 2019. It is now read-only.
fix(tooltip): Tooltip causing scroll bars to quickly show #4550
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
When the element that has a tooltip attached is hovered upon, the tooltip is created and positioned accordingly. However, there is a slight flicker between the time that the tooltip element is added to the DOM and the moment when it is positioned where it needs to be displayed. This also causes scrollbars to appear/flicker on the browser window in some cases. The fix consists of hiding the tooltip by default (display: none) and then displaying it once it is in place (display: block). Closes #4458
When the element that has a tooltip attached is hovered upon, the tooltip is created and positioned accordingly. However, there is a slight flicker between the time that the tooltip element is added to the DOM and the moment when it is positioned where it needs to be displayed. This also causes scrollbars to appear/flicker on the browser window in some cases. The fix consists of hiding the tooltip by default (display: none) and then displaying it once it is in place (display: block). Code cleanup.
|
So the |
|
The original issue #4195 where the visibility approach was added. I did some further testing and using the display approach causes inconsistent results when positioning the tooltip, thus the reason for the original change noted above. |
aroop
pushed a commit
to aroop/bootstrap
that referenced
this pull request
Oct 16, 2015
When the tooltip is rendered for positioning scroll bars may breifly appear depending on where the linked element is positioned. This change adds a negative top and left style to push the tooltip element out of view while it is being measured and positioned. Closes angular-ui#4550 Closes angular-ui#4623 Fixes angular-ui#4458
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
When the element that has a tooltip attached is hovered upon, the tooltip is created and positioned accordingly. However, there is a slight flicker between the time that the tooltip element is added to the DOM and the moment when it is positioned where it needs to be displayed. This also causes scrollbars to appear/flicker on the browser window in some cases. The fix consists of hiding the tooltip by default (display: none) and then displaying it once it is in place (display: block).
Closes #4458