I want to display three .mp4 videos. The videos are the same, but differ in length and size. The 1mb video plays in all browsers, no problem. The 5mb and 10mb video only play in IE and Edge. This videos are inside the content folder of my project, and my code is:
<div class="col-md-4" style="text-align:center">
<h4>Create your Asset Hierarchy</h4>
<video width="320" height="240" controls preload="auto" poster="~/Content/theme/images/logo_sistrade_blue.gif">
<source src="~/Content/theme/videos/videoTesteMp45mb.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
</div>
<div class="col-md-4" style="text-align:center">
<h4>Build your Equipment tree</h4>
<video width="320" height="240" controls preload="auto" poster="~/Content/theme/images/logo_sistrade_blue.gif">
<source src="~/Content/theme/videos/videoTesteMp410mb.mp4" type='video/mp4'>
Your browser does not support the video tag.
</video>
</div>
<div class="col-md-4" style="text-align:center">
<h4>Perform Maintenance</h4>
<video width="320" height="240" controls preload="auto" poster="~/Content/theme/images/logo_sistrade_blue.gif">
<source src="~/Content/theme/videos/videoTesteMp4.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
</div>
I have no idea why this doesn't work. I tried changing the type to video/webm and video/ogg, but still does not work.
Thank you in advance.
