Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Use visibility:hidden instead of display:none to preserve layout. #18

Open
ruisoftware opened this issue Jun 28, 2015 · 0 comments
Open

Comments

@ruisoftware
Copy link

When you do $(this).css('display','none'); the this element disappears and any static or relative elements located in the DOM after this, move up and occupy the area once used by the this element. They move up, because what display:none does is hiding the element AND removing the layout space occupied by it.

However, in your code you show and hide the element so fast, that produces no noticeable flickering. But the most important thing: The elementFromPoint() might in fact not read the element underneath, but the sibling element that got just moved up.

You should use $(this).css('visibility','hidden'); instead. It also hides the this element, but maintains the space there, causing no layout changes in the elements that follow.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant