movii
7/19/2017 - 7:33 AM

翻译:《Everything You Need to Know About the CSS will-change Property》- 7

翻译:《Everything You Need to Know About the CSS will-change Property》- 7

// Rough generic example
// Get the element that is going to be animated on click, for example
var el = document.getElementById('element');

// Set will-change when the element is hovered
el.addEventListener('mouseenter', hintBrowser);
el.addEventListener('animationEnd', removeHint);

function hintBrowser() {
  // The optimizable properties that are going to change
  // in the animation's keyframes block
  this.style.willChange = 'transform, opacity';
}

function removeHint() {
  this.style.willChange = 'auto';
}