霓虹灯动画页面没有动画只出现在窗口中

时间:2015-09-10 20:18:00

标签: polymer

刚观看了霓虹灯动画页面上的最新polycast视频,并尝试了基本设置,但我的动画无效。它出现在窗口,但就是这样。这是索引页面:

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <script src='../../../bower_components/webcomponentsjs/webcomponents-lite.js'></script>
    <link rel="import" href="../../../bower_components/neon-animation/neon-animated-pages.html">
    <link rel="import" href="../../../bower_components/paper-material/paper-material.html">
    <link rel="import" href="../../../bower_components/paper-item/paper-item.html">
    <link rel="import" href="../../../bower_components/iron-flex-layout/iron-flex-layout.html">
    <link rel="import" href="../../../bower_components/neon-animation/neon-animations.html">
    <link rel="import" href="x-module">
</head>
<body class="fullbleed">

    <neon-animated-pages class="flex" selected="1">
        <x-module></x-module>
    </neon-animated-pages>

</body>
</html>

这是元素:

<link rel="import" href="../../../bower_components/polymer/polymer.html">
<link rel="import" href="../../../bower_components/neon-animation/neon-animatable-behavior.html">
<link rel="import" href="../../../bower_components/neon-animation/animations/slide-from-right-animation.html">
<link rel="import" href="../../../bower_components/paper-material/paper-material.html">


    <dom-module id="x-module">
        <style>

        </style>

        <template>
           <paper-material>
               <h1>HELO</h1>
           </paper-material>
        </template>

        <script>
        Polymer({
            is:'x-module',
            behaviors: [Polymer.NeonAnimatableBehavior,
            Polymer.NeonAnimationRunnerBehavior],
            properties:{
                animationConfig:{
                    value: function() {
                        return {
                            'entry': {
                            name: 'slide-from-right-animation',
                            node: this,
                            timing:{
                                duration: 10
                            },
                        },
                        'exit': {
                            name: 'slide-right-animation',
                            node: this,
                            timing:{
                                duration: 10
                            },
                        }
                    };
                 }
              }
           },
        });
        </script>
    </dom-module>

我添加了计时属性,看看它是否真的发生得非常快。我确定我只是在做一些愚蠢的事情,但我已经阅读了自述文件和演示。我看不出有什么问题

0 个答案:

没有答案