How can my standard web page be viewed through my mobile template (as per Blogger)?

I've got a website which I've made a mobile template for. I didn't want to use a separate subdomain like mobiles.mywebsite.com, and so went with the following lines of code:

<link rel="stylesheet" media="(max-device-width: 767px)" href="/mobile-style.css">

<meta name="viewport" content="width=320">

It all works great. I would, however, like to give visitors to my mobile site the option to see the full, standard site if they choose, as available on Blogger sites. For example, a standard Blogger URL will be like this:

http://ift.tt/ScBRQf

Mobile users who visit the above URL end up with the following URL in their address bar:

http://ift.tt/1zmKJYd

Down at the bottom of the blog, Blogger gives a link to "View web version," and when the user taps on it, they end up at the standard site, with the following URL:

http://ift.tt/1JWngZd

Likewise, at the bottom of that page is a link to "View mobile site," which takes them back to

http://ift.tt/1zmKJYd

Skipping all the "?m=1" and "?m=0" stuff, I could make this all possible manually by duplicating all my pages so that there's versions with and without the LINK and META tags as given above. But that would obviously be ridiculous. I unfortunately don't know anything beyond HTML and CSS, and so am wondering if there's some kind of javascript/jquery IF statements (or something along those lines) that I could implement alongside the LINK and META tags that might make this all possible.

Thanks in advance.