hyper-video-loop

Plugin for Hyper that plays a youtube video in the background

install

~ hyper install hyper-loop

config

in your .hyper.js config you can customize the attributes assigned to the iframe that loads the youtube video:

  {
    config: {
      hyperLoop: {
        width: "116%",
        height: "116%",
        src: "https://www.youtube.com/embed/vpuZ0KSELQM?autoplay=1&loop=1&mute=1&playlist=vpuZ0KSELQM",
        frameborder: "0",
        allow: "autoplay; encrypted-media;",
        style: `
          opacity: 0.77;
          transform: translateX(-8%) translateY(-8%);
        `
      }
    }
  }

Note

To achieve a transparent canvas (only available on mac) set backgroundColor in config to a completely transparent rgba value by setting the alpha channel to 0 e.g. rgba(255,255,255,0). The other channels will be set as the background color behind the video.