Also, I want to add something.
I reduced the issue with the paper-drawer-panel to the minimal one and here
my question is , how can I manage the animations? because it seems that
the paper-drawe uses the neo-animated-pages animation, so the effect of
open-close drawer is destroyed.
I add the following to the previous example
<neon-animatable>
<paper-drawer-panel right-drawer force-narrow drawer-width="358px"
disable-swipe>
<div class="landing_drawer" drawer>
aaaa
<!--<div ng-show="landingMenu=='login'" >-->
<!--<h2>We’re in beta.</h2>-->
<!--<h3>Join us today.</h3>-->
<!--<p>Welcome to the all-new Cuelr beta, the worlds-->
<!--most advanced music search and discovery-->
<!--engine for music consumers and professionals.</p>-->
<!--<p>Years of working in the music industry,-->
<!--continuously challenging the status quo and-->
<!--reimagining the way we discover new music,-->
<!--helped us to shape Cuelr.</p>-->
<!--<p>-->
<!--Now the beta is available to our community-->
<!--of early members!-->
<!--</p>-->
<!--<p>-->
<!--Join us today to experience a new and unique-->
<!--marketplace to discover the latest trends in-->
<!--music from around the world and submit your-->
<!--feedback to help further improve the service.-->
<!--</p>-->
<!--<p>-->
<!--We look forward to hearing from you!-->
<!--</p>-->
<!--<paper-button class="big button" style="margin-top:
38px;margin-bottom:20px;border: 2px solid #333333;color: #333333;width: 297px;"
ng-click="closeTutorial('map')">Request Login</paper-button>-->
<!--<p style="text-align: center">-->
<!--Already have an acount - <a><b>Log in</b></a>-->
<!--</p>-->
<!--<p style="text-align: center;padding-bottom: 0">By signing up, I agree to
Cuelr’s</p>-->
<!--<p style="text-align: center;padding-bottom: 0">-->
<!--<a ui-sref="info({section: 'terms_of_service'})"><b>Terms of
Service</b></a> and-->
<!--<a ui-sref="info({section: 'privacy_policy'})"><b>Privacy Policy</b></a>.-->
<!--</p>-->
<!--</div>-->
<!--<div ng-show="landingMenu=='signup'" >-->
<!--<h2><b>Sign up</b></h2>-->
<!--<h3>It’s totally free</h3>-->
<!--<paper-button class="big button" style="background-color:#3b5998;color:
#ffffff;width: 297px;" ng-click="closeTutorial('map')">sign in with
Facebook</paper-button>-->
<!--<paper-button class="big button" style="margin-top:
10px;background-color:#55acee;margin-bottom:20px;color: #ffffff;width: 297px;"
ng-click="closeTutorial('map')">sign in with Twitter</paper-button>-->
<!--<div class="horizontal layout center" style="margin: 0;padding: 0">-->
<!--<div class="line flex"></div>-->
<!--<p style="padding: 0 16px">or</p>-->
<!--<div class="line flex"></div>-->
<!--</div>-->
<!--<p style="text-align: center"> Register with your email address </p>-->
<!--<paper-input-decorator class="settings_input password_field signup_input
required layout vertical" label="Password" > <input type="password"
is="core-input" ng-model="credentials.fullName" class="ng-pristine ng-untouched
ng-valid" placeholder="Full Name" aria-label="Full Name">
</paper-input-decorator>-->
<!--<paper-input-decorator class="settings_input email_field signup_input
required layout vertical" label="Email or username" > <input is="core-input"
ng-model="credentials.username" class="ng-pristine ng-untouched ng-valid"
placeholder="Email" aria-label="Email"> </paper-input-decorator>-->
<!--<paper-input-decorator class="settings_input password_field signup_input
required layout vertical" label="Password" > <input type="password"
is="core-input" ng-model="credentials.password" class="ng-pristine ng-untouched
ng-valid" placeholder="Password" aria-label="Password">
</paper-input-decorator>-->
<!--<paper-button style="margin-bottom:0;margin-top:6px" class="signin_button
button pink_button big" ng-click="login()" role="button" tabindex="0">Sign
In</paper-button>-->
<!--<p style="text-align: center">-->
<!--Already have an acount - <a><b>Log in</b></a>-->
<!--</p>-->
<!--<p style="text-align: center;padding-bottom: 0">Which account type is right
for me?</p>-->
<!--<p style="text-align: center;padding-bottom: 0">Already have an account -
<a>Log in</a>-->
<!--</p>-->
<!--</div>-->
</div>
<div main >
vvvv
<a
onclick="document.querySelector('paper-drawer-panel').togglePanel();">ssss</a>
</div>
</paper-drawer-panel>
</neon-animatable>
When I clicked on the link to toogle the panel, the animation are not the
right for the drawer, it is using the parent one from the
neon-animated-pages
best!
On Monday, March 28, 2016 at 4:07:19 PM UTC-3, [email protected] wrote:
>
> Hi,
>
> When I enter to a page with animation, first time I see blank because
> opacity :0
>
> <template is="dom-bind">
>
> <neon-animated-pages style="height: 100%" id="pages" selected="0"
> entry-animation="slide-from-bottom-animation"
> exit-animation="slide-down-animation">
>
> <neon-animatable>
> <section id="land_p">
> <paper-tabs selected="0" id="discover_tabs" style="margin-right:
> 150px">
>
> <paper-tab class="tab_item" onclick="moveTo(4)" >Brands</paper-tab>
> <paper-tab class="tab_item" onclick="moveTo(3)">Artists</paper-tab>
> <paper-tab class="tab_item" onclick="moveTo(2)">Mission</paper-tab>
> <paper-tab class="tab_item" onclick="moveTo(1)">About</paper-tab>
> </paper-tabs>
>
> </section>
> </section>
> </neon-animatable>
> <neon-animatable>
> <section id="about_p" style="width: 100%;">
>
> <c-paper-icon-button class="back_to_home_button" icon="arrow_back"
> onclick="document.querySelector('neon-animated-pages').selected=0"></c-paper-icon-button>
>
> </section>
> </neon-animatable>
> <neon-animatable>
> <section id="mission_p" style="width: 100%;">
> <div ui-view="mission" style="overflow-y: auto;height: 100%" ></div>
> </section>
> </neon-animatable>
> <neon-animatable>
> <section id="artists_p" style="width: 100%;">
>
> </section>
> </neon-animatable>
> <neon-animatable >
> <section id="brands_p" style="width: 100%;">
> <div ui-view="brands" style="overflow-y: auto;height: 100%" ></div>
> </section>
> </neon-animatable>
> <neon-animatable>
> <section id="how_p" style="width: 100%;">
> <div ui-view="how" style="overflow-y: auto;height: 100%" ></div>
> </section>-->
> </neon-animatable>
>
> </neon-animated-pages>
> </template>
> <script>
> function moveTo(p){
> document.querySelector('neon-animated-pages').selected=p;
> }
> </script>
>
>
>
> Also, If I add a paper-drawe-panel in one of the neon-animatable, the draw is
> not working.
>
>
> any idea?
>
>
> thanks!
>
>
Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups
"Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/polymer-dev/40f3f8f1-adf9-4286-91d8-687c49060737%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
