<div class="demo-preview-block"> <p> Default: <div id="p1" class="mdl-progress mdl-js-progress"></div> </p> <p> Indeterminate: <div id="p2" class="mdl-progress mdl-js-progress mdl-progress__indeterminate"></div> </p> <p> Buffering: <div id="p3" class="mdl-progress mdl-js-progress"></div> </p> <h5>Data binding</h5> <div>Drag me and check how the "Default" bar reacts...</div> <p> <input class="mdl-slider mdl-js-slider" type="range" min="0" max="100" value="44" tabindex="0" step="1" id="slider"/> </p> </div>