- for (var x = 0; x < 15; x++)
  a(href="https://manu.ninja/")
    img(width="160", height="90", src="https://static.manu.ninja/files/big_buck_bunny_720p_h264_thumbnail.jpg")
    video(width="160", height="90", preload="auto", loop)
      source(src="https://static.manu.ninja/files/big_buck_bunny_720p_h264_preview.mp4",  type="video/mp4")
      

a {
  float: left;
  &:hover {
    img {
      display: none;
    }
    video {
      display: block;
    }
  }
}
img {
  display: block;
}
video {
  display: none;
}

const videos = document.querySelectorAll('video');
[].forEach.call(videos, vid => {
  vid.addEventListener('mouseenter', () => vid.play());
  vid.addEventListener('mouseleave', () => vid.pause());
});