Does ionic give a default viewport meta?


#1

I want to customize the viewport meta in the head tag ,but its does not working ,Maybe it has been overwrite by ionic or not ,I can’t get this

var phoneWidth = parseInt(window.screen.width);
var phoneScale = phoneWidth/640;

var ua = navigator.userAgent;
if (/Android (\d+\.\d+)/.test(ua)){
  var version = parseFloat(RegExp.$1);
  // andriod 2.3
  if(version>2.3){
    document.write('<meta name="viewport" content="width=640, minimum-scale = '+phoneScale+', maximum-scale = '+phoneScale+', target-densitydpi=device-dpi">');
    // andriod 2.3 above 
  }else{
    document.write('<meta name="viewport" content="width=640, target-densitydpi=device-dpi">');
  }
  // others 
} else {
  document.write('<meta name="viewport" content="width=640, user-scalable=no, target-densitydpi=device-dpi">');
}

#2

Ionic does provide a default viewport meta tag, you can take a look here: https://github.com/driftyco/ionic/blob/master/js/utils/viewport.js. I’m not sure there is a way to disable it at the moment, so you might just have to comment out the code for now.

This was done to provide consistency for the keyboard and scrolling across devices and versions, because behavior between them varies so much.


#3

@tim Thank you for your reply ,I will have a try ,I am confused about how to scale the ionic app ,I have a 640px based psd files,how can i let it fit in any device ,IPhone 4s or IPhone 6 +