How do I add video elements to a WinJS.UI.ListView

If you create a WinJS.UI.ListView and add interactive content to it, by default you will not be be able to interact with it. So with a video element you will not be able to press the play button or change the volume.

If you want to enable this behaviour all you have to do is add the class name win-interactive to the root element of the WinJS.Binding.Template that you use for the template of the WinJS.UI.ListView

<div id="videoTemplate" data-win-control="WinJS.Binding.Template">
        <div class="win-interactive">
            <h2 data-win-bind="innerText: title"></h2>
            <video width="300" src="video.mp4" controls="controls" />
Comments (1)

  1. wloescher says:

    Just the nugget of information I needed at just the right time. Thanks!

Skip to main content