html - How to transition page scrolling using Polymer's neon elements -


i new polymer. i'm trying explore animation resources through polymer neon-* elements.

based on demos in polymer project, found how transition between pages:

<neon-animated-pages id="pages" class="flex" selected="{{selected}}"  entry-animation="slide-from-left-animation" exit-animation="slide-right-animation">    <neon-animatable>       <h1>consultoria</h1>    </neon-animatable>    <neon-animatable>       <h1>treinamento</h1>    </neon-animatable>    <neon-animatable>       <h1>institucional</h1>    </neon-animatable> 

this works great!

but, explore various forms of transition , animation in single page, using polymer elements, similar inbox google homepage:

http://www.google.com/inbox/

my initial question: how scroll transitions of sections tags implemented

<section> </section> 

using polymer neon- * elements , similar google inbox behavior?

thank contribution!

i think can't polymer because have iron-pages , neon-animated-pages sections switching , neither supports natively 1 page scrolling.

i looking similar example google inbox, in end created of iscroll.js.

it looks , works because there no scroll bars in browser, iscroll uses css transition.

https://github.com/sgoran/polymer-spa


Comments