Jquery mobile. Loading message on page change

Question

I'm building offline application with Phonegap + JQM. Is there any possibility to set globally that on every page change event would showing loading message?

Answer 1

$(document).live('pagebeforehide', function(){
    $.mobile.showPageLoadingMsg();
    //More stuff to do
});

$(document).live('pageshow', function(){
    //More stuff to do
    $.mobile.hidePageLoadingMsg();
});

Answer 2

Nirmal's answer doesn't work for me, but binding to the individual pages does:

$("div[data-role='page']").live('pagebeforehide', function(){
    console.log("showing....");
    $.mobile.showPageLoadingMsg();
    //More stuff to do
});

$("div[data-role='page']").live('pageshow', function(){
    //More stuff to do
    console.log("hiding....");
    $.mobile.hidePageLoadingMsg();
});

jsFiddle - look at the logs, sometimes it's too fast to see