block by aaizemberg 3d58580fa947cc1938d44df0b2b78f71

La flecha de Zenón

Full Screen

La flecha de Zenón

http://www.jorgemacchi.com/en/works/253/la-flecha-del-zenon

Viendo la obra de Jorge Macchi en el MALBA, quise hace una versión similar usando la librería d3.js

index.html

<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>//www.jorgemacchi.com/en/works/253/la-flecha-del-zenon</title>

<style>
  .centered {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
</style>
</head>

<body>
  <h1 class="centered" style="font-size:256px"></h1>

<script>

var from = 10; // counter
var fs = 256;  // font-size

var timer = setInterval(update, 1000);
  
d3.select("h1").text(from);

function update() {
  if (from > 1) {
    from = from - 1;
  }
  else {
    from = from / 2;
    fs = fs / 1.25;
  }
  d3.select("h1").style("font-size",fs+"px").text(from);
}
</script>

</body>
</html>