Add swipeup and swipedown to jQuery Mobile

For some reason unknown to me, even after releasing 4 major framework versions, jQuery Mobile developers never implemented swipeup and swipedown events. As always, jQuery community solved this problem, particularly user named blackdynamo. Plugin Plugin can be found here: https://github.com/blackdynamo/jquerymobile-swipeupdown If you can't access it directly just use the code found below: // jQueryMobile-SwipeUpDown // ---------------------------------- // // Copyright (c)2012 Donnovan...

Advanced jQuery Mobile tutorial – Part 3 – Dynamic Content

Welcome to our third installment of “Advanced jQuery Mobile tutorial”, a new series where we talk about more advanced aspects of jQuery Mobile development. In the last article, we discussed jQuery Mobile client-server communication, and I showed you an easy example. Now I want to expand that topic and show you how to work with dynamically added content, and...

Page events order in jQuery Mobile – Version 1.4 update

If you want to have full control over your jQuery Mobile application first thing you need to learn is page events, their sequence, order and how to properly use them. Even more, you need to understand when they will trigger, at wait point and how to delegate them. Last year I covered almost everything related to jQuery Mobile page...

How to remove jQuery Mobile styling

jQuery Mobile is a somewhat unique framework. From the point when you include it into your project, it will ultimately take over project UI. Usually, this is expectable but sometimes we only need to improve part of our UI, be it mobile or classic desktop application. To make our life easier, jQuery Mobile provides us with several methods of...

Advanced jQuery Mobile tutorial – Part 2 – Client / Server Communication

Welcome to our second installment of “Advanced jQuery Mobile tutorial”, a new series where we talk about more advanced aspects of jQuery Mobile development. This article will cover everything you need to know about jQuery Mobile client-server communication. Don't take this too lightly, this is a crucial topic when working on a hybrid jQuery Mobile applications. We will try...

10 life saving jQuery Mobile plugins

As time goes by jQuery Mobile is becoming more and more popular, at the same time our needs have grown even further. To remedy this, just like its older brother jQuery Mobile is open to 3rd party development and last three years have so a lot of jQuery Mobile plugins growing to a full maturity. Every plugin here is tested...

Advanced jQuery Mobile tutorial – Part 1 – Responsive design

I intended to write this article one year ago just as I started writing this blog. It is meant for jQuery Mobile developers, doesn't matter how advanced your knowledge is. I will try to cover broader advanced topics ranging from responsive design among various devices up to the client/server communication. If there's something unclear or you want me to...

Using validation plugin with jQuery Mobile 1.4

This jQuery plugin makes client side form validation easy, whilst still offering plenty of customization options. Other prominent validation plugins exist but this one is still the most commonly used one, not to mention it works very well with jQuery Mobile. Unfortunately, it is not an easy task to find a working example. There are several crucial factors...

Solution to jQuery Mobile page content empty space height problem

This is usually a first problem every jQuery Mobile developers stumbles upon. Every jQuery Mobile page can hold one or more data-role elements (header, content and footer). Since jQuery Mobile 1.2 header and footer and fixed elements, you may or may not use them. On the other hand, content is one element you will always want to use, basically...

How jQuery Mobile page handling affects javascript execution

For us to understand this situation we need to understand how jQuery Mobile works. It uses Ajax for page loading into the DOM. First page is loaded normally. Its HEAD and BODY is loaded into the DOM. That content will stay there (unless page is refreshed) to await further content loading. When second page is loaded, only its BODY content...