Join GitHub today
Quick tips for making jQTouch offline-capable.
Using HTML5's Cache Manifest feature, it is possible to make jQTouch sites/apps run offline.
First, create a Cache Manifest file and place in the root of your directory. For this example, we'll call it
sample.manifest- though you could hypothetically call it whatever you want. Currently, Cache Manifest files must list every resource used on the page to function properly. There are several advanced features to dictate which files must be served online, and fallback files for unavailable resources, though these are outside the scope of this document. A sample Cache Manifest file for the main jQTouch demo:
CACHE MANIFEST demos/main/ajax.html demos/main/ajax_post.php demos/main/index.html demos/main/jqt_startup.png demos/main/jqtouch.png themes/css/jqtouch.min.css src/lib/zepto.js src/jqtouch.min.js
Also, the manifest must be served with a MIME type of
text/cache-manifest, which you can accomplish on most servers with a
AddType text/cache-manifest .manifest
jQTouch ships with a sample .htaccess with this and other helpful rules.
To implement the Cache Manifest, simply reference it in your HTML like this:
jQTouch comes with an offline debugger extension, jqt.offline.js. Simply include file this after you include jQTouch and it will log all manifest events to the console. It is recommended to set
fullscreen: false when initializing jQTouch, and enabling the console in Settings > Safari > Developer.