Mobile: slide content scrolling issue

Hi, thanks for your great slider! I’ve a quite big problem with Swiper on mobile browsers: I’ve built a website with nested swipers, slides have 100% width and height and as requirement parent slides should move vertically (as it does with eg. parentSwiper.swiper({direction:'vertical',effect:'slide'})), some slides contain long texts that need a scrollbar when screens become smaller: using overflow-y: auto works great on desktops but on mobiles/touch devices text scrolling doesn’t work (a vertical swipe triggers a slide movements while the text remains unscrollable, it should scroll text and then start moving the slider when reaching text ‘borders’).

Is there a way to have Swiper integrated scrollbar working for slide content? the demos show it working only for swiper-container as an aternative to pagination, it would be very useful for responsive websites/apps to have it working for slide content.

(with another project that used Swiper 2.x I got a semi-working solution for vertical swiper with vertical scrollbar for slides contents by tweaking swiper code, but it was buggy because it needs to rely on timers and double clicks/touches to allow both native overflow scrolling for contents and slides scrolling)

[nolimits4web]

Ok, here is a pretty nice working solution. Works well on iOS https://jsfiddle.net/8fgphstx/1/

Here is the JS:

var swiper = new Swiper('.swiper-container', {
    direction: 'vertical',
});
var startScroll, touchStart, touchCurrent;
swiper.slides.on('touchstart', function (e) {
    startScroll = this.scrollTop;
    touchStart = e.targetTouches[0].pageY;
}, true);
swiper.slides.on('touchmove', function (e) {
    touchCurrent = e.targetTouches[0].pageY;
    var touchesDiff = touchCurrent - touchStart;
    var slide = this;
    var onlyScrolling = 
            ( slide.scrollHeight > slide.offsetHeight ) && //allow only when slide is scrollable
            (
                ( touchesDiff < 0 && startScroll === 0 ) || //start from top edge to scroll bottom
                ( touchesDiff > 0 && startScroll === ( slide.scrollHeight - slide.offsetHeight ) ) || //start from bottom edge to scroll top
                ( startScroll > 0 && startScroll < ( slide.scrollHeight - slide.offsetHeight ) ) //start from the middle
            );
    if (onlyScrolling) {
        e.stopPropagation();
    }
}, true);

[lock[bot]]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.