I have searched a lot of places for this issue and still have not come up with a fix. I am trying to implement the custom text loader when an external link is clicked on. A lot of the code I got was from the very jQuery mobile site and none of it worked! There has got to be something simple I am not getting here.

When the link is clicked on, the page DOES delay like I have it set for, but it does not display the custom loading message that I am trying to implement.

And yes, I have placed the script in between the jQuery code script and the jQuery mobile script to override the default loader.

This is what I have currently after having tried many different things

1. 
   

   <script type="text/javascript"> $(document).bind("mobileinit", function(){ $.mobile.loadingMessageTextVisible = true; $.mobile.loadingMessage = "Your page is loading...please wait"; }); $('.show-page-loading-msg').click(function(event) { $.mobile.loading("show"); //$.mobile.loading('show', {text: "Your page is loading...please wait", textonly:true });  setTimeout(function() { window.location.assign('products.html'); }, 50); }); </script>

Some things are commented out since I figured out that some methods were now deprecated since jQuery mobile 1.2.

The link code is :

1. 
   <a href="http://www.thuraya.com/" rel="external" data-role="button" data-textonly= "true" data-textvisible="true" data-msgtext="Text only loader" class="show-page-loading-msg">Click Here to Learn More</a>

Again I have a lot of stuff on it since I've tried multiple things.

This is a multipage mock website with a lot of code, so I'd rather just post what needs to be addressed specifically. Thanks in advance for any help on this issue.