I have embedded MP4 videos into my topics for HTML output and it works wonderfully. The videos are published as part of the Flare project to Resources/Videos/. The user needs to click play to start the video. However, the volume is always set to 100%. I can set the MadCap:Param_muted to true, but I'm concerned some users will find it annoying to enable the volume after the video has started. When I "Edit Multimedia", Flare displays a dialog box where I can set parameters (the Advanced tab). The only Audio parameter for an embedded MP4 file is Mute. I tried adding my own parameter (with and without % and in various numbers) to the Object element but this has not worked. Has anyone discovered a way to set the initial volume of an embedded MP4 file to 50% ?
<object MadCap:HTML5Video="true" src="Resources/Videos/wba_intro_hr.mp4" MadCap:Param_controls="true" MadCap:Param_volume="50%" MadCap:Param_loop="false" MadCap:Param_autoplay="false" style="width: 640px;height: 360px;" MadCap:Param_muted="false">
</object>
Control initial volume of embedded MP4 video
Re: Control initial volume of embedded MP4 video
I found a temporary solution. Flare appears to convert the <object> tag to a <video> tag when publishing to HTML. Once I understood that, I was able to set the volume by using a script.
I've tried various JavaScript ideas, but I was unable to set an ID on the <object> tag and have that survive the transformation to the Video tag. Thus, I couldn't reference the video by ID in a script. However, I did find a solution where I can set the volume of the first Video element on a page. I suspect I could set up a For loop to set the volume for all video elements if I needed to, but having a ID would be nicer.
<body onload="setVolume()">
. . .
<object MadCap:HTML5Video="true" src="Resources/Videos/wba_intro_hr.mp4" MadCap:Param_controls="true" MadCap:Param_loop="false" MadCap:Param_autoplay="false" style="width: 640px;height: 360px;" MadCap:Param_muted="false">
</object>
. . .
<script>
function setVolume() {
document.getElementsByTagName('video')[0].volume = 0.5;
}
</script>
Initial testing shows this works in Chrome, Firefox and Edge.
Please let me know if there is an easier way to do this without script.
I've tried various JavaScript ideas, but I was unable to set an ID on the <object> tag and have that survive the transformation to the Video tag. Thus, I couldn't reference the video by ID in a script. However, I did find a solution where I can set the volume of the first Video element on a page. I suspect I could set up a For loop to set the volume for all video elements if I needed to, but having a ID would be nicer.
<body onload="setVolume()">
. . .
<object MadCap:HTML5Video="true" src="Resources/Videos/wba_intro_hr.mp4" MadCap:Param_controls="true" MadCap:Param_loop="false" MadCap:Param_autoplay="false" style="width: 640px;height: 360px;" MadCap:Param_muted="false">
</object>
. . .
<script>
function setVolume() {
document.getElementsByTagName('video')[0].volume = 0.5;
}
</script>
Initial testing shows this works in Chrome, Firefox and Edge.
Please let me know if there is an easier way to do this without script.