Rendition Menu

<script type="module" src="https://cdn.jsdelivr.net/npm/@mux/mux-video/+esm"></script>

<h1>Rendition Menu</h1>

<media-controller id="mc">
  <mux-video id="video" slot="media" src="https://stream.mux.com/Sc89iWAyNkhJ3P1rQ02nrEdCFTnfT01CZ2KmaEcxXfB008.m3u8" poster="https://image.mux.com/Sc89iWAyNkhJ3P1rQ02nrEdCFTnfT01CZ2KmaEcxXfB008/thumbnail.webp?time=13" preload="metadata" muted="" crossorigin=""></mux-video>
  <media-rendition-menu anchor="auto" hidden="">
    <div slot="header">Quality</div>
  </media-rendition-menu>
  <media-control-bar>
    <media-play-button></media-play-button>
    <media-time-display showduration=""></media-time-display>
    <media-time-range></media-time-range>
    <media-mute-button></media-mute-button>
    <media-rendition-menu-button></media-rendition-menu-button>
    <media-pip-button></media-pip-button>
    <media-fullscreen-button></media-fullscreen-button>
  </media-control-bar>
</media-controller>