Tagged: fallback image, LayerSlider
-
AuthorPosts
-
October 4, 2017 at 10:20 am #860072
Hello Kriesi Support Team
We are using the layer slider on the website with the link below. It is running a movie in the background.
You suggest using the layer slider as the client wanted to have the movie running on mobile devices as well. It now is running on most devices, but on some, we only get a white surface. it is loading the text but not the movie.
Do you know why this could be the case? We tried to empty the cache, reboot the device etc, still the same. We have different devices like Samsung Galaxy, iPhones etc where it is not working.
Login details below just in case.
Thanks so much for your help, as always
CorinaOctober 5, 2017 at 5:55 am #860420Hey Corina,
Thank you for using Enfold.
What is the actual model and versions of those devices? I checked the site on IE10 and the video is playing. If the video is working on IE10, it should be working on those devices unless they’re very old.
Best regards,
IsmaelOctober 5, 2017 at 8:57 am #860484Hi Ismael
Thanks for getting back to me. Okay, so here are some of the devices we tested that did not load the movie… they can see the fading tagline though (or the red dot of it as the text is white).
// Galaxy A5 (2016) | Model SM-A510F | Android v7
// Uuawei P10 fc | Model VKY-L09 | Build No VKY-L09C432B162 | Android v7
// iPhone 6s | Model MKQR2ZD/A | iOS 11.0.2
// iPhone 6 | Model MG4H2ZD/A | IOS 11.0.2Thanks so much. Appreciate your helps.
Kindest Regards,
CorinaOctober 7, 2017 at 2:42 am #861235Hi,
Thank you for the info.
We added the closing tag of the “video” shortcode. Please remove browser cache or hard refresh then check the page again. If possible, please upload the video on youtube or vimeo. Maybe, the compression of the video is not compatible on those devices.
</video>
Best regards,
IsmaeleOctober 7, 2017 at 3:34 am #861250Hi Ismael
Thanks so much for all your help. I will test with the customer early next week.
Vimeo & Youtube are unfortunately not an option as the quality it was feeding through on this particular movie was really bad. We tried and the customer was not happy.Will let you know how we go.
Again thanks heaps, and have a wonderful weekend.
CorinaOctober 7, 2017 at 4:09 am #861265Hi,
Vimeo & Youtube are unfortunately not an option as the quality it was feeding through on this particular movie was really bad. We tried and the customer was not happy.
Using those services will make sure that the video is compatible on every devices and platforms and you should not host your own video. Here’s why:
// https://www.wp101.com/10-reasons-why-you-should-never-host-your-own-videos/
Best regards,
IsmaelOctober 7, 2017 at 4:18 am #861267Hi Ismael
I fully agree with you and I strongly recommended using Vimeo & Youtube. Unfortunately, the client deemed the quality it was streaming as not good enough (since it adapts the quality to the download speed). I then suggested using a beautiful photo instead of the video, which the client did not agree with either.
The movie was created by the client and the video that is quite tricky to compress at good quality as it has so much information in it.
Thanks for the link. I think I forwarded that to the client before but will do so again.
All the best and thanks again.
CorinaOctober 9, 2017 at 7:28 am #861764Hi Ismael
Following your comment. I went and checked on the live site. And there is a </video> closing tag. The site I sent you, was a copy of the live site.
Could you let me know where you added the closing </video> tag? Screenshot below of the live site and also login details if required.
Thanks so much.
CorinaOctober 9, 2017 at 7:43 am #861767Hi,
I added the closing tag in the video layer that was set as the video background. If they really need to host their own video, please ask them to use an MP4 container with H.264 or MPEG-4 AVC compression/codec. This format is supported on most browsers specially on iOS devices.
Best regards,
IsmaelOctober 9, 2017 at 9:29 am #861790Hi Ismael
Thanks for getting back to me. It was definitely in there, the </video> closing tag. it’s now in there 2x in on the development server, where you logged in.
Could you explain what an MP4 container is? so sorry and thanks so much.
This is the code I currently have in the video layer of the layer slider:
<video width=”100%” height=”100%” frameborder=”0″ webkitallowfullscreen mozallowfullscreen allowfullscreen preload=”metadata” muted loop playsinline>
<source src=”http://pre.ithub.ch/wp-content/uploads/videos/pre_CRF_30.mp4″ type=”video/mp4″>
<source src=”http://pre.ithub.ch/wp-content/uploads/videos/pre_V9_CRF_50.webm” type=”video/webm”>
<source src=”http://pre.ithub.ch/wp-content/uploads/videos/pre_9000k.ogv” type=”video/ogv”>
</video>All the best,
CorinaOctober 10, 2017 at 7:27 am #862324Hi,
Please remove the duplicate closing tag. Are they using any video converters? MP4 is a video format but it’s called a container because it can have different compressions or codec such as the H.264. If this is still not working, please advice the client again to use youtube or vimeo.
Best regards,
IsmaelOctober 12, 2017 at 9:07 am #863261Hi Ismael
We got it. It was the order the movies were listed… if the mp4 movie is the first listing it works. If it is the 2nd listing it doesn’t (always) work. Very strange, as I would have thought the browser reads the code and picks what works on the device.
Thanks so much for all your help.
All the best,
CorinaOctober 13, 2017 at 12:03 pm #863878 -
AuthorPosts
- The topic ‘LayerSlider movie not working on all mobile devices’ is closed to new replies.