Unleash the power of jQuery on iPhone and create impressive iPhone style cool effects and widgets with these jQuery plugins.

1. Create The iPhone Springboard in XHTML CSS and jQuery

With this jQuery tutorial, I will enlighten you on how to create the iPhone Springboard in xHTML, CSS and jQuery.

2. Creating The iPhone Contacts App with CSS and jQuery

Today, I am bringing you another chapter of transferring some of the beautiful iPhone layouts to the webbrowser. The design of the Contacts app will be used and displayed in your browser. Funny fact is that this is the first “iPhone to CSS/jQuery conversion”.

3. jQTouch-jQuery Plugin For Mobile Developement

jQTouch is a jQuery plugin for mobile web development on the iPhone, iPod Touch, and other forward-thinking devices.

4. iPhone-like Sliding Headers

The iPhone has a few unique UI features, one in particular are the static headings when you are scrolling through a list, so you know the context of the content. We will see how to create this effect using jQuery.

5. iPhone Click Effect Using MooTools or jQuery

One thing I love about love about Safari on the iPhone is that Safari provides a darkened background effect when you click a link. It is the most subtle of details but just enforces than an action is taking place. So why not implement that on any page? We can easily do so using MooTools or jQuery.

6. An iPhone Scrolling Plugin for jQuery

Ever want to replicate the iPhone scrolling experience in your browser? Well I thought it would be a novel idea so I whipped together a small jQuery plug-in that turns any overflowed block element into a scrollable pane.

7. jQuery Tutorial – Create the iPhone unlock screen using jQuery

The iPhone: Everybody knows what it is, many people “played around” with the gadget and most people love it. I also own one of these amazing smartphones, and the looks of the software is really, really sleek and innovative (Just like we re used from Apple). I wanted to transfer (some) of these amazing designs to a webpage to re-create the same look and feel for webbrowsers. Today, I m going to show you how to create The iPhone unlock screen in xHTML, CSS and jQuery

8. jQuery Iphone Style Ajax Switch

In this tutorial I will purely be looking at making a simple ajax request using the functionality of the iPhone buttons to trigger a script to return a string based on whether the switch is on or off. You need to include the jquery.iphone-switch.js file along with jquery which is in the download.

9. jQuery Tutorial – Create a Slick iPhone Mobile Interface from any RSS Feed

We are going to create a web page that is formatted specifically for the iPhone (but would presumably be good for other mobile devices as well). This web page will dynamically fill itself with content from any RSS feed that you give it.

10. jQuery Flick Plugin

This plugin adds Apple iPod/iPhone (firmware 2.0+) flick/scroll functionality to jQuery. Use built in Touch methods including ontouchstart, ontouchend and ontouchmove.

11. SpinTheWheel jQuery iPhone Spin Wheel Effect Plugin

JQuery.spinTheWheel.js is a plugin for jQuery. It s designed to create an intuitive way of selecting a value in a defined span. Use where you want total control of the value the user can pick but where a standard slider won t do the trick due to a too big span. Or just because it looks good.

12. jQuery Swipe Plugin

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.

13. jQuery Tutorial – Create iPhone style Password Fields using jQuery

Apple has implemented an alternative method on iPhone/iPod Touch: where the passwords get masked while typing but the last character in row is shown in plain text. So now lets us learn how to create such cool iPhone style password fields using jQuery.

14. iToggle for jQuery

A completely unashamed rip of those lovely sliding on/off buttons on the iPhone, making checkboxes (and radio buttons) look good! With the help of jQuery this plugin will replace any checkbox or radio element you want with this sliding alternative.

15. jQuery Tutorial – Create iPhone-style Checkboxes using jQuery

Ever wanted those flash iPhone on/off toggle switches on your webpage? Love jQuery? Well then I ve got something special for you. iphone-style-checkboxes implements the iPhone toggles as replacements for standard HTML checkboxes.

16. jQuery iPhone Plugin

The jQuery iPhone Plugin extends jQuery s functionality for specific iPhone usages.

17. Create iPhone-style buttons with the iButton jQuery Plug-in

At work we just released another jQuery plug-in called the iButton jQuery Plug-in (which brings the total of open source jQuery plug-ins we ve released to four.) This plug-in allows you to generate iPhone-style buttons from checkbox and radio elements.

18. jQuery Touch Plugin

This plugin adds Apple iPod/iPhone (firmware 2.0+) touch functionality to jQuery. Use built in Touch methods including ontouchstart, ontouchend, ontouchmove, ongesturestart, ongesturechange and ongestureend.

19. jQuery iPhone UI

This is JavaScript library for prototype iPhone interface on web pages.

With this jQuery tutorial, I will enlighten you on how to create the iPhone Springboard in xHTML, CSS and jQuery.

Web Site
Demo
Download

Today, I am bringing you another chapter of transferring some of the beautiful iPhone layouts to the webbrowser. The design of the Contacts app will be used and displayed in your browser. Funny fact is that this is the first “iPhone to CSS/jQuery conversion”.

Web Site
Demo
Download

jQTouch is a jQuery plugin for mobile web development on the iPhone, iPod Touch, and other forward-thinking devices.

Web Site
Download

The iPhone has a few unique UI features, one in particular are the static headings when you are scrolling through a list, so you know the context of the content. We will see how to create this effect using jQuery.

Web Site
Demo

Ever want to replicate the iPhone scrolling experience in your browser? Well I thought it would be a novel idea so I whipped together a small jQuery plug-in that turns any overflowed block element into a scrollable pane.

Web Site
Demo
Download

One thing I love about love about Safari on the iPhone is that Safari provides a darkened background effect when you click a link. It is the most subtle of details but just enforces than an action is taking place. So why not implement that on any page? We can easily do so using MooTools or jQuery.

Web Site
Demo

In this tutorial I will purely be looking at making a simple ajax request using the functionality of the iPhone buttons to trigger a script to return a string based on whether the switch is on or off. You need to include the jquery.iphone-switch.js file along with jquery which is in the download.

Web Site
Demo
Download

This is JavaScript library for prototype iPhone interface on web pages.

Web Site
Demo
Download

This plugin adds Apple iPod/iPhone (firmware 2.0+) flick/scroll functionality to jQuery. Use built in Touch methods including ontouchstart, ontouchend and ontouchmove.

Web Site
Demo
Download