2016-06-27 14 views
0

Ich habe gerade angefangen zu lernen, Polymer und ich versuche, Eingabe und Beenden der Animation auf einem Papier-Dialog. Es sieht so aus, als ob die Eingabeanimation perfekt funktioniert, die Ausgangsanimation jedoch nicht. Ich mache einen Workaround, indem ich eine jQuery manuell codiere, aber ich möchte die eingebaute Fähigkeit des Papierdialogs verwenden.Polymer Papier-Dialog Beenden Animation funktioniert nicht

Danke.

 <paper-dialog id="dialog" entry-animation="slide-from-top-animation" exit-animation="fade-out-animation" class="dialogstyle" no-cancel-on-outside-click no-cancel-on-esc-key> 
     <div class="buttons"> 
      <paper-button id="closebutton" dialog-dismiss autofocus><i class="fa fa-times" aria-hidden="true"></i></paper-button> 
     </div> 

     <strong>content here</strong> 

    </paper-dialog> 

Antwort

0

Die Exit-Animation sollte so lange arbeiten, wie Sie die fade-out-animation.html umfassen erinnern.

<head> 
 
    <base href="https://polygit.org/polymer+1.11.1/components/"> 
 
    <script src="webcomponentsjs/webcomponents-lite.js"></script> 
 
    <link rel="import" href="paper-dialog/paper-dialog.html"> 
 
    <link rel="import" href="neon-animation/web-animations.html"> 
 
    <link rel="import" href="neon-animation/animations/slide-from-top-animation.html"> 
 
    <link rel="import" href="neon-animation/animations/fade-out-animation.html"> 
 
</head> 
 
<body> 
 
    <paper-dialog entry-animation="slide-from-top-animation" 
 
       exit-animation="fade-out-animation" opened> 
 
    <h2>Header</h2> 
 
    <div>Dialog body</div> 
 
    </paper-dialog> 
 
</body>

codepen