刚观看了霓虹灯动画页面上的最新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>
我添加了计时属性,看看它是否真的发生得非常快。我确定我只是在做一些愚蠢的事情,但我已经阅读了自述文件和演示。我看不出有什么问题