28 Popular jQuery Plugins for Mobile Touch Events and Gestures

freebies 6652 Comments

Touch screen devices are ruling the mobile platform nowadays. Most of the smart phones have it, tablet and based on the trend, it's slowly come to our desktop as well. To develop a touch screen compatible web applications or website, you can use the existing touch events of the browsers or the platforms.

Recommended: Free Webmaster Tools(including SEO, DNS, HTML and Text tools)

This time, we have collected some of the popular jQuery extension and plugins that allow you to integrate touch gestures into your mobile applications.

Please note that some of the links provided in this article may be affiliate links and we will earn commission if you buy their products through our links.

JQuery Mobile Plugin for Gesture Events

1. Swiper

swiper

Swiper – is the free and ultra lightweight mobile touch slider with hardware accelerated transitions (where supported) and amazing native behavior. It is intended to use in mobile websites, mobile web apps, and mobile native apps. Designed mostly for iOS, but also works great on Android, Windows Phone 8 and modern Desktop browsers.

2. Jquery Splitscreen Plugin

jquery splitscreen plugin

Splitscreen is a bold and different way for websites to display image ads, promote content, or welcome web surfers to their web page. Splitscreen is an unique, interactive, fullscreen, billboard style, jQuery overlay plugin with three modes: splash, promo, and teaser; and several options for plugin customization, like autoplay for example.

3. Jquery Homepage Banner Slideshow / Product Viewer

jquery homepage banner slideshow / product viewer

This file is suitable for homepage banner, slideshow, product viewer, Gallery even though you can use as an intro. All animations are customizable so it suitable for any type of banners. You can use any number of layer on each slider. You can position and spacing each layer easily using data attributes.

4. Translucent – Responsive Banner Rotator / Slider

translucent – responsive banner rotator / slider

This is a jQuery Banner Rotator / Slideshow with translucent background set for caption. Supports Responsive and fluid layouts. Supports touch swipe navigation on iPad and Android tablets. 8 example variations included with source package. Around 55 plugin settings included for deeper customization.

5. Zuper Responsive Multitouch Slider

zuper responsive multitouch slider

This Zuper Slider uses unobtrusive javascript and a powerful configuration panel for effects and design elements to transform a block of simple HTML markup into a beautiful elegant slider. When we create the Zuper Slider is lightweight, fast loading, mobile ready, responsive, easy to use,has multiple skins and much more. Zuper Slider is the most complex and powerful slider that you can use.

6. Iosslider – Touch Enabled Jquery Horizontal Slider Plugin

iosslider – touch enabled jquery horizontal slider plugin

iosSlider is a jQuery plugin which allows you to integrate a customizable, cross-browser content slider into your web presence. Designed for use as a content slider, carousel, scrolling website banner, or image gallery.

7. Jquery Banner Rotator / Content Slider / Carousel

jquery banner rotator / content slider / carousel

All In One is an Advanced Jquery Slider which comes in 5 flavors: Banner Rotator, Thumbnails Banner, Banner with Playlist, Content Slider, Carousel. It allows you to easily create powerful sliders with animated text using HTML standard tags, making the slider very easy to setup and maintain.

8. Zoomshowcase – a Jquery Banner Rotator

zoomshowcase – a jquery banner rotator

Looking for a different kind of jQuery banner? ZoomShowcase is a unique jQuery Banner that will add a fresh look to your website. It's built on top of jQuery 1.9, and comes with several customizable options.

9. Wowbook, Create Ebooks With Page Flip

wowbook, create ebooks with page flip

WowBook is jQuery plugin that allows you to create a online publication (like a book or magazine) with 2 different page flipping effects.

10. Rollbar – Jquery Scrollbar Plugin

rollbar – jquery scrollbar plugin

RollBar plugin was created with idea to replace standard browser scrollbars and make them customizable to fit perfectly in almost any site design. This plugin can be used not only as replacement of native browser scrollbars, but even to create slideshows with external controls. Among other features RollBar can auto adjust to window size, recognize touch events on Android and iOS devices and respond to custom jquery events to scroll content.

11. Jquery Mega Image Viewer – Animated Zoom and Pan

jquery mega image viewer – animated zoom and pan

The mega image viewer jQuery plugin allows you to easily replace <div> tags with animated image viewers. Viewer used for displaying high-resolution object (image – JPG, PNG, GIF). Viewer displays the given display object inside the user-defined viewport area. Viewer allows to control the position and zoom of the object displayed inside the viewport. Viewer controls the sliding and zoom of the displayed object so that the viewport area will be filled completely.

12. Sky Jquery Touch Carousel

sky jquery touch carousel

Sky jQuery Touch Carousel is a jQuery carousel plugin with rich set of features. It is responsive, touch-enabled, fast and smooth. It can be easily integrated into your own web projects. You can customize the visual appearance of the plugin with the help of the plugin options and CSS.

13. Photoswipe

photoswipe

PhotoSwipe is a FREE HTML/CSS/JavaScript based image gallery specifically targeting mobile devices.

14. Wmuslider, a Jquery Responsive Slider

wmuslider, a jquery responsive slider

I want to give back to the community by sharing the code used for the responsive slider on the homepage. Please keep in mind that it's still very raw (really) and under the MIT LICENSE, which basically means: break it, steal it but THE STUFF IS PROVIDED "AS IS"!

15. Advanced Slider – Jquery Xml Slider

advanced slider – jquery xml slider

Advanced Slider is fully responsive, mobile-ready, SEO-friendly, and offers you the option to use either HTML markup or XML. The plugin also provides an easy to use API which will allow you to further enhance the functionality of the slider and will make it possible to integrate it into your own application.

16. Touchcarousel – Jquery Content Scroller and Slider

touchcarousel – jquery content scroller and slider

TouchCarousel is mobile-friendly and lightweight jQuery content scroller with touch navigation for mobile and desktop. May be used as carousel, banner rotator and image gallery.

17. Smooth Zoom Pan – Jquery Image Viewer

smooth zoom pan – jquery image viewer

This is a javascript / CSS based image viewer prepared to display product photos, maps or any image within custom small area. Can be configured and implemented in web pages with simple copy / paste steps.

18. Parallax Slider – Responsive Jquery Plugin

parallax slider – responsive jquery plugin

Parallax Effect – Full Collection of Sliders comes in 4 versions: Classic, Perpetuum Mobile, Mouse Interaction and Ultra. Each of these 4 versions has 2 skins (bullets & thumbs) and can be used as Fixed Dimensions or as Full Width. Please see the features and check the live preview of this slider and convince yourself of its quality.

19. Swinxyswipe – Jquery Touch &Amp; Mouse Pagination

swinxyswipe – jquery touch & mouse pagination

leak, smooth and simple pagination which works across desktop and touch devices. SwinxySwipe brings together everything you need to achieve the same swipe enabled pagination effect as seen in various app stores and native app widgets but in a way which works across touch and mouse devices.

20. Zozo Accordion – Responsive and Touch-Friendly

zozo accordion – responsive and touch friendly

Zozo Accordion is not just another accordion. It's responsive and touch-friendly with a lot of customization options that can be integrated into your site/blog quickly without writing any code. Some of its key features includes: such as CSS3 transitions with jQuery fallback, horizontal & vertical accordion, Load content with AJAX, custom styled scrollbar for Webkit, 10 unique themes, semantic HTML5 and SEO friendly and much more.

21. Screenslider – Reponsive Touch Presentation

screenslider – reponsive touch presentation

ScreenSlider is a fullscreen slider which allows you customize effects for all parts with responsive design, support touch to move slides. Just little changes in HTML you can create a professional presentation that works on almost platforms for your projects.

22. Sequence

sequence

Sequence.js is a refreshing and modern take on website sliders. Using just HTML and CSS, Sequence allows you to create your own responsive slider with unique transitional styles. No instance of Sequence need ever be the same. There are no limitations and no in-built themes. Supported in modern desktop browsers, mobile browsers and even in old versions of Internet Explorer via a traditional fallback theme.

23. Super Menu Pack (10 Menus)

super menu pack (10 menus)

Super menu pack is a collection of 10 cool menus, 5 in pure css and 5 using jQuery framework for customize or layout with your websites or applications and projects. It's perfect for anyone who wants to give a special touch to their designs or find a starting point. I tried to create a collection as varied as possible in style and appearance to give you choice. Thinking in design working with code.

24. Jquery Dragpan

jquery dragpan

Give your website visitors the ability to navigate a large area of rendered HTML quickly. Usefull for creating maps of supermarkets, shopping malls, theme parks, zoos, festival sites, theatres, airports, seating plans in fact anywhere where the map would be larger than the users browser.

25. Royalslider – Touch-Enabled Jquery Image Gallery

royalslider – touch enabled jquery image gallery

RoyalSlider is easy to use jQuery image gallery and content slider plugin with animated captions, responsive layout and touch support for mobile devices. As navigation you can use thumbnails, tabs or bullets. Use it as image slider, slideshow, HTML content slider, gallery, banner rotator, video gallery, carousel or even presentation.

26. Touch Timeline

touch timeline

Touch Timeline is a really simple script that will take clean and semantic HTML code and turn it into an elegant and beautiful timeline/content slider. And because the script the script is very optimized for touchscreen devices, your visitors will get even better experience when viewing your site in an iPad for example. Additionally, the interface was designed with compatibility in mind. It has been designed to be very neutral to make sure it doesn't conflict with the rest of the site's design, visually. And you can always open the CSS and customize the looks!

27. 3d Touch Carousel

3d touch carousel

3D Touch Carousel is a jQuery javascript plugin for creating a carousel gallery. It supports simulate 3d mode and real 3d mode powered by CSS3 . Also it has reflection for the images, and can be set titles to show on image. Touch events are supported on Android and IOSX devices.

28. Versatile Touch Slider

versatile touch slider

Versatile Touch Slider is a jQuery plugin that offers a variety of options. It may just be a banner rotator or a shelf to display products. Has the touch feature to mobile and drag for the desktop. The navigation can also be done via buttons and menu. Through the lightbox it is possible show multimedia content (video, audio, image and html content).

You are most welcome to suggest any additions to this list. You can use the comments box below to make any suggestions.

themeforest banner
elegant themes banner

Related Articles:

You may be interested in:

Paul Miller is a web design enthusiast and avid blogger who loves to design and explore technology. He has co-founded other interesting blogs like ThinknEarn.com. Make sure to keep in touch with him on Facebook and follow him on Twitter.

Would you like to contribute to this site? Get started »
Rate this article:
(5.0 rating from 1 votes)

Comments