2016-06-27 3 views
0

방금 ​​폴리머를 배우기 시작했고 종이 대화 상자에 진입 및 종료 애니메이션을 넣으려고합니다. 엔트리 애니메이션이 완벽하게 작동하는 것처럼 보이지만 종료 애니메이션은 완벽하지 않습니다. 나는 수동으로 jQuery를 코딩함으로써 해결 방법을 찾고 있지만, 종이 대화 상자에 내장 된 기능을 사용하고 싶습니다.폴리머 종이 대화 종료 애니메이션이 작동하지 않습니다.

감사합니다.

 <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> 

답변

0

종료 애니메이션은 fade-out-animation.html을 반드시 포함해야합니다.

<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