I have gone through practically every single stackoverflow question concerning this. I still having found an answer.
I was told to add playsinline and it should do the trick but still nothing. I use videojs and I assume it's practically the same thing as using a normal html5 embed video.
I have done all that could be done. Resetting network settings,adding playsinline,adding autoplay muted and loop, using 3 different browsers namely chrome, opera and safari. This works on some ios devices but not all no matter the browser. These are mp4 video formats.
<video-js class="vjs-big-play-centered" controls preload="auto" playsinline id="vid1"><source src="" type="video/mp4"></video-js>
This is practically how my code is. I do not know what else to do as this is really stressing me out in finding the answer. Please some angel help me out...
Alright just to answer my own question.
I found out that when the attribute preload='auto' is used, ios devices/browsers load it a bit different from andriod phone.
Also this was inconsistent. It worked sometimes but majority of times it didn't.
After so many research, I was able to fix this by changing this to preload='none'.