<image-wrapper>
  <video
    muted
    autoplay
    playsinline
    oncanplaythrough="this.currentTime=0"
    poster="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQAAAAA3iMLMAAAAAXNSR0IArs4c6QAAAA5JREFUeNpj+P+fgRQEAP1OH+HeyHWXAAAAAElFTkSuQmCC"
  >
    <source src="/images/superwhite.webm" type="video/webm" />
    <source src="/images/superwhite.mp4" type="video/mp4; codecs=hvc1" />
  </video>

  <img src="/images/star-wars.webp" width="400" />
</image-wrapper>

<style>
  body {
    display: grid;
    place-items: start center;
  }

  image-wrapper {
    position: relative;
  }

  video {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  img {
    isolation: isolate;
  }
</style>