{"json_modified": "2016-03-28T08:44:39.089754", "uuid": "05758c45-7b13-41d0-b178-eef9d8dc8c73", "title": "Animating CSS properties", "url": "/en-US/docs/Tools/Performance/Scenarios/Animating_CSS_properties", "tags": [], "translations": [{"uuid": "1e36c27c-16ea-461d-a60c-0fcaefb6fab5", "title": "Animer des propri\u00e9t\u00e9s CSS", "url": "/fr/docs/Outils/Performance/Scenarios/Animating_CSS_properties", "tags": [], "summary": "Avec les <a href=\"/fr/docs/Web/Guide/CSS/Using_CSS_animations\">animations CSS</a>, il est possible de sp\u00e9cifier un nombre <a href=\"/fr/docs/Web/CSS/@keyframes\">keyframes</a>, chacune de celle-ci utilisent du CSS pour d\u00e9finir l'apparence d'un \u00e9l\u00e9ment \u00e0 un moment donn\u00e9 de l'animation. Le navigateur cr\u00e9e l'animation comme \u00e9tant une transition d'une keyframe \u00e0 une autre.", "localization_tags": [], "locale": "fr", "last_edit": "2015-09-30T10:52:51", "review_tags": []}, {"uuid": "ac650e85-7586-46b9-8904-f90ca1db4fda", "title": "CSS \u30d7\u30ed\u30d1\u30c6\u30a3\u306e\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3", "url": "/ja/docs/Tools/Performance/Scenarios/Animating_CSS_properties", "tags": [], "summary": "<a href=\"/ja/docs/Web/Guide/CSS/Using_CSS_animations\">CSS \u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3</a>\u3067\u306f\u8907\u6570\u306e<a href=\"/ja/docs/Web/CSS/@keyframes\">\u30ad\u30fc\u30d5\u30ec\u30fc\u30e0</a>\u3092\u6307\u5b9a\u3057\u3066\u3001\u305d\u308c\u305e\u308c\u306e\u30ad\u30fc\u30d5\u30ec\u30fc\u30e0\u3067\u306f\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u306e\u7279\u5b9a\u306e\u6bb5\u968e\u306b\u304a\u3051\u308b\u8981\u7d20\u306e\u5916\u898b\u3092\u5b9a\u7fa9\u3059\u308b\u305f\u3081\u306b CSS \u3092\u4f7f\u7528\u3057\u307e\u3059\u3002\u30d6\u30e9\u30a6\u30b6\u306f\u3001\u305d\u308c\u305e\u308c\u306e\u30ad\u30fc\u30d5\u30ec\u30fc\u30e0\u304b\u3089\u6b21\u306e\u30ad\u30fc\u30d5\u30ec\u30fc\u30e0\u3078\u9077\u79fb\u3059\u308b\u3053\u3068\u3067\u30a2\u30cb\u30e1\u30fc\u30b7\u30e7\u30f3\u3092\u4f5c\u6210\u3057\u307e\u3059\u3002", "localization_tags": [], "locale": "ja", "last_edit": "2015-06-15T07:42:50", "review_tags": []}], "modified": "2015-06-01T23:37:27", "label": "Animating CSS properties", "localization_tags": [], "locale": "en-US", "id": 149279, "last_edit": "2015-06-01T23:37:25", "summary": "With <a href=\"/en-US/docs/Web/Guide/CSS/Using_CSS_animations\">CSS animations</a> you specify a number of <a href=\"/en-US/docs/Web/CSS/@keyframes\">keyframes</a>, each of which uses CSS to define the appearance of the element at a particular stage of the animation. The browser creates the animation as a transition from each keyframe to the next.", "sections": [{"id": "The_CSS_rendering_waterfall", "title": "The CSS rendering waterfall"}, {"id": "CSS_property_cost", "title": "CSS property cost"}, {"id": "An_example_margin_versus_transform", "title": "An example: margin versus transform"}, {"id": "Animating_using_margin", "title": "Animating using margin"}, {"id": "Waterfall_overview", "title": "Waterfall overview"}, {"id": "Frame_rate", "title": "Frame rate"}, {"id": "Waterfall", "title": "Waterfall"}, {"id": "Animating_using_transform", "title": "Animating using transform"}, {"id": "Waterfall_overview_2", "title": "Waterfall overview"}, {"id": "Frame_rate_2", "title": "Frame rate"}, {"id": "Waterfall_2", "title": "Waterfall"}], "slug": "Tools/Performance/Scenarios/Animating_CSS_properties", "review_tags": []}