transition-property-001.html (1791B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>CSS Transitions Test: Parsing transition-property</title> 6 <meta name="assert" content="Test checks that transition-property values are parsed properly"> 7 <link rel="help" title="2.1. The 'transition-property' Property" href="http://www.w3.org/TR/css3-transitions/#transition-property-property"> 8 <link rel="author" title="Rodney Rehm" href="http://rodneyrehm.de/en/"> 9 <meta name="flags" content="dom"> 10 11 <script src="/resources/testharness.js" type="text/javascript"></script> 12 <script src="/resources/testharnessreport.js" type="text/javascript"></script> 13 14 <script src="./support/vendorPrefix.js" type="text/javascript"></script> 15 <script src="./support/helper.js" type="text/javascript"></script> 16 </head> 17 <body> 18 <!-- required by testharnessreport.js --> 19 <div id="log"></div> 20 <!-- elements used for testing --> 21 <div id="container"> 22 <div id="transition"></div> 23 </div> 24 25 <script> 26 var transition = document.getElementById('transition'); 27 28 // syntax: none | [ all | <IDENT> ] [ ‘,’ [ all | <IDENT> ] ]* 29 var values = [ 30 'none', 'all', 'width', 'all, width', 'width, all' 31 ]; 32 33 for (var i = 0, value; value = values[i]; i++) { 34 test(function() { 35 setStyle('#transition', { 36 'transition-property': value 37 }); 38 var result = computedStyle(transition, 'transition-property'); 39 assert_equals(result, value); 40 }, "parse '" + value + "'"); 41 } 42 </script> 43 </body> 44 </html>