loading message until all the images are load

Start loading when function call.

$.mobile.showPageLoadingMsg();

$.each(data.cmspages, function(key, value) {

                       content+='<li class="ui-li ui-li-static ui-btn-up-c">'+

                       '<div class="ui-grid-a">'+

                       '<div class="ui-block-a left_thumbs">';

                       for(var i=0;i<value.images.length;i++){  // multiple images in single page.

                       content+='<img src="'+imagepath+'ayana/files/gallery_image/'+value.images[i]+'" class="image_'+id+key+'">';

                       }

});

Dynamic youtube video in phonegap

Get video url like: 

http://www.youtube.com/watch?v=l32LjEtTUkY

http://www.youtube.com/embed/l32LjEtTUkY

l32LjEtTUkY

Create function like below:

function Loadvideo(catvideo){

//Get video ID from catvideo variable.

var videoid= catvideo.substring(catvideo.lastIndexOf('=')+1);

if(videoid == catvideo){

        var videoid= catvideo.substring(catvideo.lastIndexOf('/')+1);

}

Reduce query page transition time.

Go to the Jquery mobile css file.

find .in and .out in the css. you can see the below code

.in {

-webkit-animation-timing-function: ease-out;

-webkit-animation-duration: 350ms;

-moz-animation-timing-function: ease-out;

-moz-animation-duration: 350ms;

}

.out {

-webkit-animation-timing-function: ease-in;

-webkit-animation-duration: 225ms;

-moz-animation-timing-function: ease-in;

-moz-animation-duration: 225ms;

}

 and reduce the time 350ms to 10ms or as you want in these css like below.

.in{-webkit-animation-timing-function:ease-out;

-webkit-animation-duration:10ms;

-moz-animation-timing-function:ease-out;

-moz-animation-duration:10ms

}

.out{-webkit-animation-timing-function:ease-in;

-webkit-animation-duration:10ms;

-moz-animation-timing-function:ease-in;

-moz-animation-duration:10ms

}

I hope this will help you.:)
cheers...

Disable Active page When loading start

Open jquerymobile.js  and find below text

<span class='ui-icon ui-icon-loading'></span>

add one div element before the span like: 

<div class='inner_loader ui-loader-verbose'>

and end it after the h1 tag, that is created after span.

and add below css in your style.css.

Regular expresion to validate URL

var url = value.v_url;

var pattern = /(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?/;

if (pattern.test(url)) {

        content+='<a href="'+value.v_url+'" target="_blank">'; //  Url is valid

}

else{

        console.log("invalid url");

}