curran/README.md

## README.md

      
    Raw
  

              README.md
            
          
    Complete code to reproduce d3/d3-transition#47. Open the console to see what gets printed.
Built with blockbuilder.org

  
## index.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>D3 Test</title>
  <script src="https://d3js.org/d3.v4.js"></script>
</head>
<body>
  <div style="position: absolute"></div>
  <script>
    var div = d3.select("div");
div
    .style("left", "-50%")
    .transition().duration(1000)
    .style("left", "50%")
    .tween("log", function () {
        return function (t) {
            console.log(div.style("left")); // will be something like -5470.53px to 523px
            console.log(div.node().style.left); // will be something like -522.996% to 50%
        };
    });
  </script>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
	<title>D3 Test</title>
	<script src="https://d3js.org/d3.v4.js"></script>
	</head>
	<body>
	<div style="position: absolute"></div>
	<script>
	var div = d3.select("div");
	div
	.style("left", "-50%")
	.transition().duration(1000)
	.style("left", "50%")
	.tween("log", function () {
	return function (t) {
	console.log(div.style("left")); // will be something like -5470.53px to 523px
	console.log(div.node().style.left); // will be something like -522.996% to 50%
	};
	});
	</script>
	</body>
	</html>