JQM CSS Survival Kit

This is a more like a notice than a blog post. For those JqueryMobile fans out there , or those that still struggling in it, and wonder how I survived in those harse environment… here is my shared CSS Survival Kit. Its in my github [here]

Just do a simple fork if you have github account or just download the zip from the master.

Why need to use?

Well JQM for JqueryMobile, isn’t perfect and most of the time, if you wanted more features than it’s standard widgets you will have to use other third party plugins or write on yourself doing so, might inherit some rendering and sluggishness of the overall project you are developing. There are usually two wants of handling this,

  1. Strip down and identify which page is slowing things down – anything more than 2 seconds is slow.
  2. Try to remove all jquerymobile’s enhancement tag e.g. data-role, data-whatever. Let it flow like a normal webpage then put those in one by one.
  3. Use some CSS3 acceleration techniques – this is the part my Survival Kit comes in handy. It has a handful of useful css3 hacks to speed things up especially to counter flickering during transitions, weird rendering problem in scrollview etc.

How to use it ?

Just load link rel this css after, all your css of jqm and themeroller. Works with JQM 1.2+