No vertical scroll on mobile?

[tart2000]

Hi, I added class="vertical" to my slides and it works perfect on desktop. But I was surprised to see that the presentation turns horizontal on mobile. Is there a way to disable that? Is it a bug or a feature? Thanks!

[jlantunez]

It's a feature @tart2000 :) Horizontal swipe causes fewer problems:

• Facilitates to read all the content that is included on the slide.
• and makes it easier for people to navigate back and forth.

[tart2000]

Yeah, I understand your point. It definitely makes sense for slides with a lot of content. What I'm a bit doubtful about is how clear / natural it is for people to navigate... At least, on desktop, there's an animation on goNext() which means it's easy to add a button and show how to navigate from the first slide, but I didn't see any animation on mobile, so I don't really know how users are going to 'get' the horizontal sliding... Do you have any recommandations? Thanks again for your quick answers.

[jlantunez]

@tart2000 You made a very good point, Arthur! We talked about it a few weeks ago. This issue will be resolved in the next version. Please just wait a few days :)

[xerosanyam]

it is still not clear on how to achieve this. Maybe I am missing the doc

[scaraliu]

Hello, Yes, the issue of vertical scroll on mobile is a big issue. I've tested a presentation on 10 persons and 9 of them claimed that the horizontal scroll is unnatural. Any tips on hot to turn the small devices scroll direction from horizontal to vertical? Thanks.

[AdrianVillamayor]

The only way I have found and it works is by forcing the change when swipe-down or swipe-up is detected.

The events that force the swipe => https://github.com/john-doherty/swiped-events

When it detects the swipe, it picks up the position of the "#webslide" and interprets how it should act according to where it is.

let slide = $("#webslides");

document.addEventListener('swiped-up', function (e) {
    let max = Math.trunc(slide[0].scrollHeight);
    let offset = Math.trunc(slide[0].offsetHeight);
    let position = Math.trunc(slide.scrollTop());

    if ((max - offset == position)) {
        console.warn("next");
        window.ws.goNext();
    }
});

document.addEventListener('swiped-down', function (e) {
    let position = Math.trunc(slide.scrollTop());

    if (position == 0) {
        console.warn("back");
        window.ws.goPrev();
    }
});

I hope it helps something.