determine proper transform mechanism

core-scroll-header-panel.html

@@ -76,6 +76,7 @@
 
 </template>
 <script>
+(function() {
 
   Polymer('core-scroll-header-panel', {
 
@@ -291,8 +292,8 @@
     },
 
     translateY: function(s, y) {
-      s.transform = s.webkitTransform = y == null ? '' : 
-          'translate3d(0, ' + y + 'px, 0)';
+      var t = y == null ? '' : 'translate3d(0, ' + y + 'px, 0)';
+      setTransform(s, t);
     },
 
     scroll: function(event) {
@@ -311,7 +312,7 @@
       }
 
       if (!event || !this.fixed && y !== this.y) {
-        requestAnimationFrame(this.transformHeader.bind(this, y));
+        this.transformHeader(y);
       }
 
       this.prevScrollTop = Math.max(sTop, 0);
@@ -323,6 +324,19 @@
     }
 
   });
+
+  //determine proper transform mechanizm
+  if (document.documentElement.style.transform !== undefined) {
+    var setTransform = function(style, string) {
+      style.transform = string;
+    }
+  } else {
+    var setTransform = function(style, string) {
+      style.webkitTransform = string;
+    }
+  }
+
+})();
 
 </script>
 </polymer-element>