PerformanceTests/Animometer/tests/bouncing-particles/bouncing-css-shapes.html

   1 <!DOCTYPE html>
   2 <html>
   3 <head>
   4     <style>
   5         .circle {
   6             position: absolute;
   7             background-color: #000000;
   8             border-radius: 50% 50%;
   9         }
  10         .rect {
  11             position: absolute;
  12             background-color: #000000;
  13         }
  14         .star {
  15             -webkit-clip-path: polygon(50% 0%, 38% 38%, 0% 38%, 30% 60%, 18% 100%, 50% 75%, 82% 100%, 70% 60%, 100% 38%, 62% 38%);
  16             -ms-clip-path: polygon(50% 0%, 38% 38%, 0% 38%, 30% 60%, 18% 100%, 50% 75%, 82% 100%, 70% 60%, 100% 38%, 62% 38%);
  17             clip-path: polygon(50% 0%, 38% 38%, 0% 38%, 30% 60%, 18% 100%, 50% 75%, 82% 100%, 70% 60%, 100% 38%, 62% 38%);
  18         }
  19     </style>
  20     <link rel="stylesheet" type="text/css" href="../resources/stage.css">
  21     <script src="../../resources/algorithm.js"></script>
  22     <script src="../../resources/strings.js"></script>
  23     <script src="../../resources/sampler.js"></script>
  24     <script src="../../resources/extensions.js"></script>
  25     <script src="../resources/math.js"></script>
  26     <script src="../resources/utilities.js"></script>
  27     <script src="../resources/main.js"></script>
  28     <script src="../resources/stage.js"></script>
  29     <script src="resources/bouncing-particles.js"></script>
  30     <script src="resources/bouncing-css-shapes.js"></script>
  31 </head>
  32 <body>
  33     <div id="stage"></div>
  34 </body>
  35 </html>