Video questions/problems

[olledahl]

Thanks Egg!

I have searched for Siran's posts and may have found what I am looking for. Now I am holding my thumbs hoping that I will find an answer to my problems/questions.

Otherwise I will try to contact Siran to get help.

/Olle

[cmpan1]

Siran gave me this code a long time ago because I too wanted a video to play on the home page continuously... and also to 'hide' the controls.

http://specialtydesserts.com/

--------------------------------------------------------------------------------------------------------------------------------------------------------------

<video class="xar_meplayer" src="index_htm_files/website header video converted.mp4" controls autoplay width = "100%" height="100%"/ loop="true">


<style>div.mejs-controls{visibility:hidden !important;}</style>

--------------------------------------------------------------------------------------------------------------------------------------------------------------

also: Chrome has this thing where it will stop autoplay videos for some security reasons... I forgot how I turned it off in Chrome... but if needed,
a Google search will surely give it to you...

Cliff

[siran]

Unfortunately my version of Xara uses a quite old version of the media element player. This didn't allow stretching.
So what I did in V12 is:
Dragged an MP4 video to an empty website project.
Clicked 'Autostart'. (That ended in an incomplete placeholder.)
Saved the project somewhere. (Xara created a support folder along with it.)
Downloaded the files:
https://raw.githubusercontent.com/mediaelement/mediaelement/master/build/mediaelement-and-player.min.js
https://raw.githubusercontent.com/mediaelement/mediaelement/master/build/mediaelementplayer.min.css
Copied the files to the support folder.
Edited the placeholder code:
- Changed class to xar_meplayer_edit so that Xara doesn't initialize the player on startup and leave it to us so that we can add our own options.
- Removed the controls attribute.
- Added loop and muted attributes. (Muted is reuired sometimes for autostart because modern browsers might not autostart videos with sound.)
- Added some extra code and CSS:

<style>div.mejs__controls,div.mejs__layers{visibility:hidden !important;}</style>
<script>$(function(){$(".xar_meplayer_edit").mediaelementplayer({clickToPlayPause:false,stretching:"fill"});});</script>

Changed placeholder to stretch to full width (Scale origin centre)
Saved changes. (Somewhen the placeholder changed to a black rectangle...)
Exported to HTML to somewhere and tested.

The result played fine in FireFox, Opera and Chrome. In Vivaldi it only autoplayed after I hit F5. In IE9 it didn't play correctly, only a very small video played and also the sound was played. The following note was taken from https://github.com/mediaelement/mediaelement
In general, MediaElement.js supports IE11+, MS Edge, Chrome, Firefox, Safari, iOS 8+ and Android 4.0+.
Mobile devices you would have to test yourself if the result for the desktop browsers is accaptable anyway.

[olledahl]

Thank you Siran!

I hope this will work, and I will try it later today.

/Olle

[siran]

Just a note: Vivaldi installed an update today and now it also autoplays without a refresh.