Thursday, March 26th, 2009
David Kaneda has created jQTouch a “jQuery plugin with native animations, auto list navigation, and default application styles for Mobile WebKit browsers like iPhone, G1, and Pre.”
jQTouch can now be initialized with one function:
- icon: 'jqtouch.png',
- statusBar: 'black-translucent'
This function writes all of the meta tags needed for an iPhone web app. Here are the default settings:
- fullScreen: true,
- slideInSelector: 'ul li a',
- backSelector: '.back',
- flipSelector: '.flip',
- slideUpSelector: '.slideup',
- statusBar: 'default', // options: black-translucent, black
- icon: null,
- iconIsGlossy: false,
- fixedViewport: true
There are now functions for sliding a page up, and “flipping” to a page, using WebKit’s built-in 3D capabilities. Both can be seen in the new preview
These new animations are integrated into the page history, and can be navigated by using the back button.
I’ve added a quick-and-dirty function for preloading images, which you just send as an array. For example:
- New HTML structure to ease toolbar button variations and improve animations.
- Various performance improvements
- Added minified code
- Started a custom theme, which will be offered alongside the standard Apple theme
- Created a new Home Screen icon
- Removed some iPhone-dependent code
David also answered some questions for us:
How does it compare to iUI?
It is similar in the way it can load views via built-in HTML or dynamic GET/POST requests, but it uses hardware-accelerated animations, and also includes transitions like slide up and 3D page flip. It also includes code for image preloading, a custom theme, and a much easier setup function which eliminates the need to write META tags for the app icon, viewport settings, etc.
What kind of extended functionality are you looking into
Ultimately, I plan on testing extensively on the G1 and, eventually, the Palm Pre. Other plans include a more robust theming system, and various callback methods to make extending jQTouch even easier.
With PhoneGap, would it just be a script that you can get built in?
I am currently in talks with the PhoneGap crew, and we are planning on including it stock with the kit. We’re currently unsure if the script should be ported to XUI or remain based on jQuery.
Posted by Dion Almaer at 4:02 am