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 their 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 is 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 simple redirect for anyone on mobile using one of the many methods we've laid out. Then, just use a simple location.replace
. This code sample does a little...