Index: tools/perf/page_sets/tough_animation_cases/css_animations_simultaneous_by_inserting_style_element.html |
diff --git a/tools/perf/page_sets/tough_animation_cases/css_transitions_simultaneous_by_inserting_style_element.html b/tools/perf/page_sets/tough_animation_cases/css_animations_simultaneous_by_inserting_style_element.html |
similarity index 56% |
copy from tools/perf/page_sets/tough_animation_cases/css_transitions_simultaneous_by_inserting_style_element.html |
copy to tools/perf/page_sets/tough_animation_cases/css_animations_simultaneous_by_inserting_style_element.html |
index b8e2b95d068647e6daf93fc31a9251d1bee2e404..441e17817157107c5c2c0da931edaa175ee3ca90 100644 |
--- a/tools/perf/page_sets/tough_animation_cases/css_transitions_simultaneous_by_inserting_style_element.html |
+++ b/tools/perf/page_sets/tough_animation_cases/css_animations_simultaneous_by_inserting_style_element.html |
@@ -1,7 +1,6 @@ |
<!DOCTYPE html> |
<meta name="viewport" content="width=device-width, user-scalable=no"> |
<link rel="stylesheet" type="text/css" href="resources/tablet.css"> |
-<link rel="stylesheet" type="text/css" href="resources/transition.css"> |
<script src="resources/perftesthelper.js"></script> |
<container id="container"></container> |
@@ -10,25 +9,32 @@ |
var N = PerfTestHelper.getN(1000); |
var duration = 1000; |
var style = null; |
-var keyframe = 1; |
-var keyframeValues = [0, 1] |
for (var i = 0; i < N; i++) { |
- container.appendChild(document.createElement('target')); |
+ var target = document.createElement('target'); |
+ container.appendChild(target); |
} |
-function startAllTransitions() { |
- keyframe ^= 1; |
+var nextAnim = 0; |
+function updateStyle() { |
if (style) { |
style.remove(); |
} |
+ anim = 'anim' + nextAnim++; |
style = document.createElement('style'); |
- style.textContent = 'target { opacity: ' + keyframeValues[keyframe] + '; }'; |
+ style.textContent = '\ |
+ target {\ |
+ -webkit-animation: ' + anim + ' 1s linear infinite;\ |
+ }\n\ |
+ @-webkit-keyframes ' + anim + ' {\ |
+ 0% { opacity: 0; }\ |
+ 100% { opacity: 1; }\ |
+ }'; |
container.appendChild(style); |
} |
-requestAnimationFrame(startAllTransitions); |
-setInterval(startAllTransitions, duration); |
+updateStyle(); |
+setInterval(updateStyle, duration); |
PerfTestHelper.signalReady(); |
</script> |