Is swiping possible for Inline Slides containing a Youtube embed?

[bradconner]

I absolutely love the native inline sliders that are available to us these days! It makes my life so much easier & removes the need for heavy plugins.

My question is about the swiping functionality for slides which contain the Cornerstone Video element set to “Embed” mode with a Youtube embed inside.

I want to be able display Youtube videos which mobile users can swipe left or right to navigate in addition to the standard Left/Right arrow controls. But the swiping functionality appears to break when trying to swipe on the video… The gaps in between the slides still swipe, as well as other standard elements such as images or headlines. But is swiping is not available for Youtube embeds?

Is there a work-around for this, or it is simply the nature of the beast for I-frame embeds in general?

Here is a Sandbox demonstrating the above question: https://ecrossroads.org/sandbox3/

Thank you!

[tristup]

Hi Brad,

Thanks for reaching out.
It is not very clear what exactly you are trying to acheive here, can you please explain a bit more about it? Specifically, on the swiping functionality you are referring to.

Thanks

[Thaelys]

@bradconner

as other standard elements such as images or headlines. But is swiping is not available for Youtube embeds?

Hello,

I had the same issues with images.
You can try to add an absolute 100% widht/height transparent DIV with a Z-index that is higher than the video embeded. This way the video is displayed but the swipe is not on the video but the DIV, enabling swipe.

It’s not a great solution but at least that’s something.

Cheers

[bradconner]

Hey Thaelys,

Thank you so much for your thoughtful reply! I gave your advice a shot and was able to restore swiping functionality, but this meant the native Youtube controls (such as the Play button) were inaccessible because of the DIV on top.

I did some searching and experimented with various combinations of pointer-events:none or pointer-events:auto, but haven’t made any progress so far.

I have wondered if there might be a way to use something like !important to force the draggable properties of the slide container holding the I-frame, but I don’t have a strong enough grasp on how to make that happen.

At any rate, thanks again.

Brad

[bradconner]

Hi Tristup,

Thank you for your reply. I apologize that my description was not clear enough. I noticed that my term “Swipe” is actually called “Drag” in the Cornerstone interface. Let me try to describe the problem more clearly with that in mind:

I have set up the Inline Slider to display multiple slides. And the scrolling action for the Inline Slider is set to “Drag” (See first screenshot)

Each of those slides contain a Video Element set to “Embed” (as opposed to “Player”). Inside these Video Elements are Youtube Video embeds. (See second screenshot and third screenshot)

This works great for desktop, but mobile users are unable to use their thumbs to drag/swipe left to navigate to the next slide or drag/swipe right to navigate to the previous slide.

My hope is to somehow enable the Swipe/Drag ability for Inline slides which contain Youtube embeds.

Thank you for any assistance or conclusions you can offer!

Best,

Brad

.

.

[ruenel]

Hello Brad,

Thank you for the clarifications. Regretfully you cannot use drag because most of your slides has a video. Be advised that the video needs to be tap or awaits some events from the user to play/stop or do anything for the video. It is best to use Click interaction and put a Slide Navigation element instead for easier navigation of the slides.

Hope this makes sense. Thanks.

[bradconner]

Hi Ruenel, thank you for taking the time to reply.

This is unfortunate because swiping/dragging has become the standard for most mobile applications. Seeing that 99% of my traffic is comes from a touch-oriented device, I can’t afford to use desktop oriented navigation solutions that rely on clicking arrows for segmented pagination.

I guess it’s not a perfect world, huh? Theme.co/Cornerstone is still my favorite builder for Wordpress though, and I’m thankful for the hardwork everyone puts in to make it so useful. I will just add a 3rd party plugin and use shortcodes on this one.

Thank you for clarity.

Best,

Brad

[ruenel]

You are most welcome, Brad.