I am trying to create the following scenario with a responsive embedded vimeo video:
- When volume controls are available, start with volume 0
- When volume controls are not available, start with volume 1
This is the current code:
jQuery( document ).ready( function () {
var vimeo_intro_video_options = {
id: /* video_id */,
autoplay: true,
loop: true,
};
var vimeo_intro_video = new Vimeo.Player('vimeo-intro-video', vimeo_intro_video_options);
// Set Volume to 0
vimeo_intro_video.setVolume(0);
}
});
The problem with this is that some mobile devices allow setting the volume and some dont, but none of them have volume controls in the player. Therefore I end up with a muted video on some devices even though the user has volume turned on (only Android so far).
One possible solution would be to use userAgent
to detect mobile devices and not set the volume there. Is there a better way?