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

Need iron-resize to be notified earlier in neon-animated-pages before the animation starts #222

Open
omarbelkhodja opened this issue Feb 14, 2017 · 1 comment

Comments

@omarbelkhodja
Copy link

Description

I'm using multiple pages, each of them has an app-layout-header. I'am animating the transition between the different pages.The app-layout-header needs to resize, each time a new page is visible.

Expected outcome

A correct display of each page.

Actual outcome

The content of the pages is wrong until the new page finishes the transition, because the app-layout-header component is using some header.heightOffset, which is zero, when page is not visible (display: none).
The resize event should be notified as soon as "display: none" is removed.

I added the last line in the following code inside neon-animated-pages, to fix my problem :

_onIronSelect: function(event) {
   ...
    // display the selectedPage during the transition.
   selectedPage.classList.add('neon-animating');
   // Resize the selected page
   this.async(this._notifyPageResize);
@mgibas
Copy link

mgibas commented Apr 20, 2017

Notifying page before animation as in @omarbelkhodja example fixes the issue.

Related issue: PolymerElements/app-layout#280

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

2 participants