There is nothing easier and cleaner than just creating a standalone jQuery Mobile page. Let's just do that and simply import the page we want with AJAX. We can then pull out the parts we want and leave the rest.
The biggest disadvantage to this approach is mostly academic. Progressive enhancement is shot. The site completely breaks for anyone who doesn't have JavaScript on his or her device. My contention is that it probably doesn't matter. I can't speak for everywhere, but here in the United States, if you're not on a smartphone, you're not on the web with your device; simple as that. There are of course exceptions that only prove the rule. However, if your market were different, you would want to consider if this option is right for you. So, let's continue.
On any given page, all we'll really need is a mobile redirect using one of the methods we've laid out. Then, just use a simple location.replace
method. This code sample does a little more than...