Building Blocks Overview by enjalot

index.html

<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
</head>
<style> 
  body {
    margin: 0;
    padding: 0;
    position:fixed;
    top:0; left: 0; right: 0; bottom: 0;
  }
  a {
    width: 100%;
    height: 100%;
    display: block;
  }
  img {
    position: absolute;
    top: 65px;
    left: 240px;
    width: 480px;
  }
</style>

<body>
  
  <!-- 

  <a href="https://www.youtube.com/watch?v=NrBwgJGvS2c">
    <img src="//img.youtube.com/vi/NrBwgJGvS2c/0.jpg"></a>
  unfortunately this doesn't work inside a sandboxed iframe (in building-blocks, it does work on bl.ocks.org)
-->
  <iframe width="960" height="500" src="https://www.youtube.com/embed/NrBwgJGvS2c?rel=0&html5=1" frameborder="0" sandbox="allow-scripts allow-same-origin"></iframe>

  </a>

  <script>
    console.log("you are now rocking with d3", d3);
  </script>
</body>

Building Blocks Overview

Links in the video

Act I: The project itself

Act II: The reasons we do it

Act III: Making a new block

Post Script: Bookmarklet

index.html