Possible to disable @media queries or force a resolution? Reason: Allow an iphone to see the desktop site?
I had the same issue with a client. But the problem was there were 120+ CSS files contained the media queries. So what I did is, set the viewport width. I have used this snippet on that site and working fine. Using this, even you can give the option for the users to toggle between responsive design and non-responsive design.
$(document).ready(function(){
$('meta[name="viewport"]').prop('content', 'width=1440');
});
Note: 1440 is your preferred screen width.
Hope this helps :)
I would add a class to your <html>
or <body>
such as class="force-desktop"
and then on your media selector add
@media () {
body:not(.force-desktop) {
//styles
}
}
or something similar
The solution of IJas without JQuery looks like:
var viewport = document.querySelector("meta[name=viewport]");
viewport.setAttribute('content', width=1440);