Menu Close Menu


Jquery nuts and bolts


Web development using JavaScript frameworks has always proved befitting for developers who need to create rich, interactive and outstanding websites and web applications. One such JavaScript framework that has received appreciations from global web developers is jQuery Mobile. As a brand new framework specially designed for building mobile web apps, jQuery Mobile has been built on top of jQuery and is well equipped with a suite of excellent user interface elements that can be efficiently used in the mobile apps. If you're new to jQuery Mobile, then keep on reading this blog as I'll be making you familiar with all interesting aspects related to this awesome JavaScript framework.


A closer look at jQuery Mobile

Serving as an easiest means for building websites and applications, jQuery Mobile is a JavaScript framework that comes loaded with several touch-friendly UI widgets and a simple AJAX powered navigation system that supports animated page transitions. A huge number of developers contribute open source plug-ins for jQuery, and you can find a suitable plug-in for almost any application you might have. The wide range of plug-ins and the simple syntax make jQuery such a great library.


What all does jQuery Mobile do?

Quite unlike a variety of JavaScript frameworks available in the market, jQuery Mobile does a lot more for easing the process of developing user interfaces for mobile web apps. Here's a look at some of the best things that are done by jQuery:


  • It renders several new custom events that allow you to detect mobile and touch specific activities including tapping, swiping, tapping and holding, rotating the device and many more.
  • With a built-in markup-driven interface configuration, jQuery Mobile makes it convenient for you to create a basic app interface with the help of HTML. Plus, there's no need for you to write even a single piece of JavaScript code.
  • It utilizes progressive enhancement for ascertaining that the app interface works brilliantly on any web-enabled device.
  • It utilizes a series of themes that make it simple for you to customize the overall look of your application.

Unveiling the jQuery Mobile Page Structure

Well, a majority of pages in your jQuery Mobile web apps will include the following basic template:


<!DOCTYPE html>



  <title>Page Title</title>

  <link rel="stylesheet" href="" />

  <script src=""></script>

  <script src=""></script>



<div data-role="page">

  <div data-role="header">

    <h1>Page Title</h1>


  <div data-role="content">

    <p>Page content goes here.</p>   


  <div data-role="footer">

    <h4>Page Footer</h4>






The three things that you need to include in your page for using jQuery Mobile are:

  • jQuery Mobile CSS file(
  • jQuery library(jquery-1.4.3.min.js)
  • jQuery Mobile library(

One of the best things about the jQuery Mobile Page structure is that you can easily create multiple pages within a single HTML page, resulting into a smoother user experience.


Ajax navigation adds to the excellence of jQuery Mobile

Ajax works as the right tool for making mobile user experience as smooth as possible. In-line with this fact, jQuery Mobile uses Ajax for allowing the linked pages to get loaded by default. In simple words, instead of the browser following a specific link for opening a new page, jQuery Mobile simply intercepts the link, requests the focused page via Ajax, followed by incorporating the new page content into the focused page's DOM. And that's not all, Ajax also allows jQuery Mobile developers to use URL hashes for ensuring that each page receives its individual and 100% unique bookmark able URL.


jQuery Mobile reflects a greater potential for mobile web app development

It is quite interesting to note that within 36 hours of the release of jQuery Mobile's beta version, an app was being built using the technology. John Resign, the creator of jQuery has displayed his confidence in jQuery Mobile and is keenly looking forward to making the JavaScript framework available for more and more mobile web app developers across the world. If you're an avid supporter of open web, then jQuery Mobile will serve as your best-fit launch. Backed by a rock-solid foundation for creation of impressive mobile apps, jQuery Mobile has opened doors to innovation in mobile web app design and development. With such a remarkable tool at their disposal, developers can deliver apps that look great and operate exceptionally.


Wrapping Up

The flexibility and easily theme able design of jQuery Mobile has made the framework stand out from the crowd of mobile web app development frameworks. So, get going and opt for utilizing the features of jQuery Mobile for delivering high-quality apps that run on varied platforms.


About Emily Heming

Emily Heming is an iPhone app developer and blogger and Currently working at Xicom Technologies. A Mobile apps development services provider which offers the reliable iPhone development services.

Read Article →


For the first time ever, our users can use a HTML Editor for checking demos or making blogger widgets offline. Using our HTML Editor, you can create Navigations, Widgets, Blogger Plugins and also can make a  simple web pages. The HTML editor supplies a rich text box for you to enter your raw HTML and a preview button. Its probably not for use by serious developers as actual HTML editor, but both can be starting points for development of such an widget.


  • Open or Edit HTML Files using this program and save them as HTML.
  • Split-Screen Preview lets you view your webpage in a browser right from inside the Code Editor.
  • Support for Windows XP SP3 to Windows 8.1.
  • Support for all versions of IE.

We will also trying to add more features in next few days.


What is an HTML Editor


An HTML editor is a specialized piece of software that assists in the creation of HTML code. Similar to text editors such as Notepad and TextEdit, HTML editors allow users to enter raw text.

Most (if not all) professional web developers use an HTML editor to create and maintain their websites. This is because a good HTML editor can boost productivity enormously.




Blogger Tools


Download Now


Note:- The rich text box only support stylesheet named with sytle.css or you can write a code under the body using “<style> tag. We hope it will fix as soon as possible.

I am sure for newbie bloggers who are looking for an easy and correct way to optimize their blogs widgets, this tool provides an easy option to edit widgets and web pages. Take good care of your loved ones and don't forget to share this exciting free tool with your friends! :)

Read Article →