0

I already had this working for most phone but for some reason iPhones will not work.

I've create a button and changes the meta tag with jquery: 

$( document ).ready(function() {
    $("#desktopversion").click(function(){
        $('meta[name="viewport"]').prop('content', 'width=1380, initial-scale=0');
    });
    $("#nvs").click(function(){
        $('meta[name="viewport"]').prop('content', 'width=1380, initial-scale=0');
    });
});

But for some reason, the page gets cut off on iPhone

enter image description here

Any idea what I might be doing wrong?

Thanks in advance!

Danny Brouwer
  • 47
  • 9
  • http://stackoverflow.com/questions/1230019/how-to-set-viewport-meta-for-iphone-that-handles-rotation-properly this might be helpful – Aslam Feb 14 '17 at 11:38

1 Answers1

0

Please read this article ,its may be help you

https://webdevdoor.com/responsive-web-design/change-viewport-meta-tag-javascript

if (screen.width <= 480) {
 document.getElementById("viewport").setAttribute("content", "width=480; initial-scale=0.5");
}
Hari Om Srivastava
  • 350
  • 1
  • 10
  • I've tried it, it is now zoomed in but still cut off.. Thanks for your reply anyway. – Danny Brouwer Feb 14 '17 at 12:40
  • Okay, I've checked it ones more and it is kind of working. You get zoomed in with the initial-scale of 0.5. If you swipe down, it will show the rest of the website, but if you scale the page with 2 thumbs, it keeps cut off. I hope this is clear enough since it is hard to explain, haha. – Danny Brouwer Feb 14 '17 at 13:05