Détection mobile sous IOS

if (window.navigator.userAgent.match(/like Mac OS X/i)) {

}

Détection web app Full Screen

if (window.navigator.standalone) {

}
<meta name="apple-mobile-web-app-capable" content="yes" />
<!-- iPhone & android ICON -->
<link rel="apple-touche-icon" href="icon.png" />

<!-- iPad ICON-->
<link rel="apple-touch-icon" sizes="72x72" href="touch-icon-ipad.png" />

<!-- iPhone/Ipad (Retina) ICON-->
<link rel="apple-touch-icon" sizes="114x114" href="touch-iconiphone4.png" />
<meta name="viewport" content="width=device-width" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<!-- iPhone -->
<link rel="apple-touch-startup-image"
      media="(device-width: 320px)"
      href="apple-touch-startup-image-320x460.png">

<!-- iPhone (Retina) -->
<link rel="apple-touch-startup-image"
      media="(device-width: 320px)
         and (-webkit-device-pixel-ratio: 2)"
      href="apple-touch-startup-image-640x920.png">
<!-- iPad (portrait) -->
<link rel="apple-touch-startup-image"
      media="(device-width: 768px)
         and (orientation: portrait)"
      href="apple-touch-startup-image-768x1004.png">
<!-- iPad (landscape) -->
<link rel="apple-touch-startup-image"
      media="(device-width: 768px)
         and (orientation: landscape)"
      href="apple-touch-startup-image-748x1024.png">
<!-- iPad (Retina, portrait) -->
<link rel="apple-touch-startup-image"
      media="(device-width: 768px)
         and (orientation: portrait)
         and (-webkit-device-pixel-ratio: 2)"
      href="apple-touch-startup-image-1536x2008.png">
<!-- iPad (Retina, landscape) -->
<link rel="apple-touch-startup-image"
      media="(device-width: 768px)
         and (orientation: landscape)
         and (-webkit-device-pixel-ratio: 2)"
      href="apple-touch-startup-image-1496x2048.png">
Top