
-
AuthorPosts
-
February 22, 2022 at 1:43 pm #1341792
Hi Ismael,
Mobile home screen. Colour section being used at the top. I’ve unticked the default ‘Hide Video on Mobile Device’ section.
Mobile video still won’t auto play, though I know other themes allow this.
What is the workaround please?
Thanks in advance.
Chris.
-
This topic was modified 3 years, 2 months ago by
cbroome12.
February 23, 2022 at 3:43 am #1341897Hey cbroome12,
Thank you for the inquiry.
You can use the Layer Slider element and its background options instead of the color section. Unfortunately, the color section’s background video option is disabled on mobile devices by default, which is why you have the option to apply a background image as a fallback. And some devices do not automatically play videos inline, so the video if it does automatically start, will not actually play inside the color section as background but will open and start in a standalone player.
// https://developer.mozilla.org/en-US/docs/Web/HTML/Element/video#attr-playsinline
Best regards,
IsmaelFebruary 23, 2022 at 3:54 pm #1342012Thank you.
I’ve created a layer slider, and it’s working perfectly on desktop.
It’s also playing on mobile, which is excellent, however it’s only covering a 1/3rd of the mobile screen, not the whole screen.
Is there a way of increasing the mobile video height/coverage, so that the video is covering the whole screen on initial page loading, for the visitor to then scroll down to see the next section of the homepage?
Thanks again.
February 24, 2022 at 9:11 am #1342117Hi,
Thank you for the update.
Where can we see the slider? We might be able to adjust the slider height using css. Please post the site URL in the private field so that we can check the element directly.
Best regards,
IsmaelFebruary 25, 2022 at 11:20 am #1342260This reply has been marked as private.February 28, 2022 at 6:48 am #1342510Hi,
Did you change the login URL? The URL above redirect to a 404 page. For the meantime, please try to add this css code to adjust the height of the layer slider on mobile view.
@media only screen and (max-width: 768px) { /* Add your Mobile Styles here */ div#layerslider_3_lki9y56uxc7x { height: 100vh !important; min-height: 100vh !important; } }
Best regards,
IsmaelMarch 1, 2022 at 6:09 pm #1342751This reply has been marked as private.March 1, 2022 at 6:12 pm #1342752This reply has been marked as private.March 4, 2022 at 2:31 pm #1343144Hi Ismael,
Have you seen my two previous messages please?
Thanks in advance.
Chris.
March 7, 2022 at 3:24 am #1343421Hi,
Sorry for the delay. We adjusted the css code in the Quick CSS field a bit. The slider is now inheriting the height of the browser screen on mobile view.
div#layerslider_3_34w9d4cagsfk, div#layerslider_3_34w9d4cagsfk .ls-wrapper, div#layerslider_3_34w9d4cagsfk .ls-wrapper div { height: 100vh !important; }
Please check the screenshot in the private field.
If you have any additional questions at this time we kindly ask that you open them up in a separate thread. The longer threads get in the forum, they become more difficult to support as they tend to drift off topic and they also make it troublesome for users trying to search for solutions. Keeping threads relevant to their original inquiry ensures that we can keep better track of what has been resolved and that users can more effectively find answers to similar issues they might be experiencing.
Thanks!
Best regards,
IsmaelMarch 7, 2022 at 4:01 pm #1343513Hi,
I can’t see that change showing on the mobile version?
Thanks.
March 8, 2022 at 6:57 am #1343568 -
This topic was modified 3 years, 2 months ago by
-
AuthorPosts
- You must be logged in to reply to this topic.