1 <!-- 2 @license 3 Copyright (c) 2015 The Polymer Project Authors. All rights reserved. 4 This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt 5 The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt 6 The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt 7 Code distributed by Google as part of the polymer project is also 8 subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt 9 --> 10 11 <link rel="import" href="../../polymer/polymer.html"> 12 <link rel="import" href="../neon-animation-behavior.html"> 13 <link rel="import" href="../web-animations.html"> 14 15 <!-- 16 `<opaque-animation>` makes an element `opacity:1` for the duration of the animation. Used to prevent 17 webkit/safari from drawing a frame before an animation for elements that animate from display:none. 18 --> 19 20 <script> 21 22 Polymer({ 23 24 is: 'opaque-animation', 25 26 behaviors: [ 27 Polymer.NeonAnimationBehavior 28 ], 29 30 configure: function(config) { 31 var node = config.node; 32 this._effect = new KeyframeEffect(node, [ 33 {'opacity': '1'}, 34 {'opacity': '1'} 35 ], this.timingFromConfig(config)); 36 node.style.opacity = '0'; 37 return this._effect; 38 }, 39 40 complete: function(config) { 41 config.node.style.opacity = ''; 42 } 43 44 }); 45 46 </script> 47
