Disable bxslider swipe only on mobile

Question

Is there a way (preferably simple way) wither in CSS twick or Jquery function to disable swipe finger touch on mobile only? my case is that I have Bxslider enabled on a website but on mobile I break down the float with CSS to show all slides (8) at once in a static way. the problem is that the function is still running and when I swipe my fingers over the slider, even if it doesn't look like a slider anymore it moves the block of photos out of the viewport.

Anyway to just stop the swipe thing in mobile somehow? Thanks

Answer 1

Have you tried touchEnabled: false?

Also oneToOneTouch: false for good measure.

$(function () {
    var ss = $('.slideshow').bxSlider({
        touchEnabled: false,
        oneToOneTouch: false
    });
  });

.shell {
    max-height: 300px;
    max-width: 400px;
}
img {
  margin: 0 auto;
}

<link rel="stylesheet" href="http://cdn.jsdelivr.net/bxslider/4.2.5/jquery.bxslider.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<script src="http://cdn.jsdelivr.net/bxslider/4.2.5/jquery.bxslider.min.js"></script>
<section class="shell">
    <ul class="slideshow">
        <li>
            <img src="http://placehold.it/666x375/000/Fff.png&text=FIRST" />
        </li>
        <li>
            <img src="http://placehold.it/800x450/048/Fee.png&text=SECOND" />
        </li>
        <li>
            <img src="http://placehold.it/720x404/fa8/375.png&text=THIRD" />
        </li>
        <li>
            <img src="http://placehold.it/520x303/9a7/a10.png&text=FOURTH" />
        </li>
        <li>
            <img src="http://placehold.it/640x360/fd3/b0d.png&text=FIFTH" />
        </li>
        <li>
            <img src="http://placehold.it/480x270/fff/000.png&text=LAST" />
        </li>
    </ul>
</section>