10 Awesome jQuery Mobile Plugins

Sam Deering
Here are some awesome jQuery Mobile plugins for you. They are optimized for mobile websites and allow you to perform features such as mobile swipe touch, mobile device detection, mobile browser check, mobile image galleries, mobile drag n drop, mobile touch scroll, mobile ajax calls, mobile css tweaks and more! Enjoy!

Mobile related posts:

1. jQuery SwipeGallery

Optimized for mobile websites and supports swipe gestures. It is lightweight plugin, which allows to instantly create an image gallery by writing just few lines of HTML such as an unordered list of images.
jQuery-iPhone-Swipe-Gestures-.jpg

Source

2. Drag and Scale for iOS

The dragNscale plugin makes selected elements draggable,scalable,rotatable by touching and pinching on mobile platform.
Drag-and-Scale-for-iOS-.jpg
Source

3. Touch Scroll – Enable Inline Scrollable Sontent on iOS Sevices

jQuery plugin that provides a way to have inline scrollable content. It mimics the behavior of scrolling on iOS devices (iPhone, iPod touch and iPad) to solve the problem that “position: fixed;” does not work in mobile Safari. This plugin will only work for vertical-scrolling content. It has been designed this way to be lightweight and efficient for this purpose only.
Touch-Scroll-Enable-Inline-Scrollable-Sontent-on-iOS-Sevices-.jpg
Source

4. Keep Reading

The ‘Keep Reading’ plugin can be used to display a small tag in the lower right portion of a screen when the page contains content below the fold. This is very useful for mobile browsers where you may desire a long form on one page in order to cut down on network trips. The tag will alert users that they need to scroll to view additional content. Once the user scrolls the page, the ‘more content’ tag is animated out of view.
keep-reading.jpg
Source

5. Advanced Browser Check

This plugin makes a full browser check (iPhone, iPad, iPod/mobile device/touch device support/operating system, browser name and version/ plugin and ActiveX check/HTML5 support/CSS3 support)
Advanced-Browser-Check-.jpg
Source

6. jQuery Canvas Loader

Uses the canvas element to create an alternative to the typical ajax loading images. Can be used to replace an existing image or you can create a custom one that will take the place of any element on your page. This plugin is useful in browsers that do not support animated gifs such as WebKit for Android.
Warning: this plugin has not been tested in many browsers, but it does work on Mobile Safari and Android browsers.
jQuery-Canvas-Loader-.jpg
Source

7. jQuery Mobile Device Drag And Drop

The idea behind this project is to create an example of drag and drop that works on normal desktop browsers, but also supports mobile devices . This project aims to devise a drag and drop style interface with mobile device support. To be precise, most mobile devices “hijack” the action of dragging on the web browser in order to provide scrolling functionality, leaving your drag and drop items sat statically on the page.
jQuery-Mobile-Device-Drag-And-Drop-.jpg
Source

8. Align Object to Bottom

Align an Object to Bottom, using set interval, we allow for iPhone compatibility.
Align-Object-to-Bottom-.jpg
Source

9. jQuery iPhone Swipe Gestures

iPhone and iPod Touch swipe gesture support using Safari JavaScript for onTouchStart, onTouchMove, onTouchEnd and onTouchCancel. This plugin uses Mobile Safari’s built in touch events to allow jQuery binding of swipe events to any DOM element. You can override the swipeLeft and swipeRight defaults functions to create your own custom process when the gesture is detected.
jQuery-iPhone-Swipe-Gestures-.jpg
Source

10. iPhone Pinch Gestures

iPhone and iPod Touch pinch gesture support using Safari JavaScript events. A new plugin (currently in development) to allow jQuery binding of pinch events to any DOM element.
iPhone-Pinch-Gestures-.jpg
Source

Note that these plugins are optimized for use with mobiles devices such as iPhone, iPod, iPad, Sansung Galaxy S, Andriod and other popular mobile devices.

Free book: Jump Start HTML5 Basics

Grab a free copy of one our latest ebooks! Packed with hints and tips on HTML5's most powerful new features.