android - Is it possible to only call Viewport Meta tag at 768px and below? -

the basic question:

is there away can set viewport meta tag come effect @ 768px , below?

reason:

i've built responsive e-commerce site using standard @media browser sizes:

over 1200px 1025px 1199px 980px 1024px 768px 979px

due complexity of site it's not viable, time or layout wise, me use @media queries make site usable mobile browsers i'd use viewport meta tag force small mobile browsers display 768px 979px layout.

to can use:

<meta name="viewport" content="width=768px; /> 

the problem over-rides 980px 1024px @media queries designed ipad landscape, , forces ipad landscape display smaller layout designed ipad portrait, i.e. 768px 979px layout.

the answer prayers if set viewport meta tag come effect @ 768px , below - possible?

boom! fixed!

right, miserable waste of 6 hours it's done , working now, hope helps someone!

first of all, included pretty standard viewport meta tag in functions.php file:

    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.2, user-scalable=yes" /> 

i used jquery mobile in header.php @ browser width , change viewport size 768px if browser width below 700px:

    <script type="text/javascript" src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.js"></script>      <meta name="viewport" content="">      <script>         if($.mobile.media("screen , (max-device-width: 700px)")) {             // change viewport smaller devices             $('meta[name=viewport]').attr('content','width=768px');         }     </script> 

this works great - keeps nice, responsive layouts ipad landscape , portrait , gives nice viewport size mobiles. lovely