Yup – you would create a shape, and then link it to a ‘play’ action on the video element.
Or, you can have the video autoplay (muted) and then create a button on the video to unmute the video. Here’s sample code that loads a video from your resources folder, a poster image from your resources folder, is set to autoplay, and is muted. It also has the playsinline
property so that it is set to play automatically when loaded on mobile devices. Mobile Safari 9 and the latest Chrome on Android support this.
<video id="dragdrop" poster="${resourcesFolderName}/video-poster.png" width="458" height="" playsinline autoplay>
<source src="${resourcesFolderName}/video-dmg-drag.ogg" type="video/webm">
<source src="${resourcesFolderName}/video-dmg-drag.mp4" type="video/mp4">
</video>
The ‘playsinline’ property lets you autoplay video if it is muted. That would just require playsinline=""` above. This option is coming in the next update.
You can set the poster for a video with a Unique Element ID of myvideo
by running this code On Scene Load if your poster image is called image.png
and is located in your resources folder:
document.getElementById('myvideo').setAttribute('poster','${resourcesFolderName}/image.png');
There’s hundreds of options here, so it’s really up to how far you want to go.