Book Image

Bootstrap Site Blueprints

Book Image

Bootstrap Site Blueprints

Overview of this book

Table of Contents (16 chapters)
Bootstrap Site Blueprints
Credits
About the Authors
About the Reviewers
www.PacktPub.com
Preface
Index

Considering our options


Currently, there is no foolproof way to test for touch across devices. A best practice under present circumstances is to add touch events when there is a usability gain and when we can do it without conflicting with our standard mouse events. In our case, we can easily enable swipe events on our home page carousel with a JavaScript plugin and a few lines of code.

Justin Lazanowski has posted a nice write-up of three easy options for implementing swipe interaction for the Bootstrap 3 carousel. Read his post at http://lazcreative.com/blog/adding-swipe-support-to-bootstrap-carousel-3-0/.

We'll go with the TouchSwipe jQuery plugin hosted on GitHub at https://github.com/mattbryson/TouchSwipe-Jquery-Plugin.

By this route, we can add swipe interaction to our carousel with the following two steps:

  1. Fold the TouchSwipe plugin into our plugins file.

  2. Add a few lines to our main.js file.

It's that simple. Let's do it.