The Extra theme includes a Posts Carousel module which displays a posts in a side-scrolling format. On mobile, users can move between posts using “previous” and “next” arrows, and then clicking on the desired arrow. If you’d like to make navigation easier for your users, here’s how to make add a “swipe effect” to the carousel.

To add a swipe effect to the carousel, which will let the user navigate between posts simply by swiping left and right on the carousel module area, add the following jQuery code to your site:

<script>
jQuery(function($) {
	$slider = $('.posts-carousel-module');
	$slider.on("touchstart", function(event) {
		this.touchstartx = event.originalEvent.touches[0].pageX;
	});
	$slider.on("touchend", function(event) {
		touchendx = event.originalEvent.changedTouches[0].pageX;
		movedby = touchendx-this.touchstartx;
		sliderwidth = $(this).width();
		if (movedby > sliderwidth / 5) {
			$(this).find('.et-pb-arrow-prev').click();
			//alert('swipe right by ' + movedby);
		} else if (movedby < -(sliderwidth/5)) {
			$(this).find('.et-pb-arrow-next').click();
			//alert('swipe-left by ' + movedby);
		}
	});
});
</script>

You can add this to the theme by pasting it into "Extra > Theme Options > Integration > Add code to the head of your blog", after anything else that is in there.