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

Expand/collapse animation shows displaced child nodes when tree is scrolled (jQuery UI 1.12) #717

Closed
mar10 opened this issue Apr 2, 2017 · 1 comment

Comments

@mar10
Copy link
Owner

mar10 commented Apr 2, 2017

Expected and actual behavior

While the expand/collapse animation is running (jQuery UI 'blind' effect), the child nodes are displaced.

bildschirmfoto 2017-04-02 um 18 05 13

Steps to reproduce the problem

  1. Use jQuery UI 1.12
  2. Open a tree in the browser
  3. Scroll down the tree (resize the browser window to a smaller height if neccessary)
  4. Expand the 'examples' folder

Environment

  • Browser type and version:
  • jQuery and jQuery UI versions:
  • Fancytree version:
    enabled/affected extensions:
@mar10
Copy link
Owner Author

mar10 commented Apr 2, 2017

See also #716

This is caused by a different behavior of the jQuery UI 'blind' effect implementation.
jQuery UI 1.11 wrapped the<ul> element inside a <div class='div.ui-effects-wrapper'> wrapper, while the animation is running.
jQuery UI 1.12 does not create this wrapper. Instead another element is appended after the <ul>
<ul class='ui-effects-placeholder'>.

Solution:
While an animation is running, we add a class fancytree-animating to the parent <li>.
Also a CSS rule is added:

li.fancytree-animating {
	position: relative;
}

(we also add this class to the node's <ul> directly for #716)

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