12

I need to detect the devices for IOS devices by JS, for iphone-6 I check it by the ratio and devicePixelRatio, I didn't find any information to check if the device is iPhone 7 plus.

I found information for the older devices,

What are the device-width css viewport sizes of the iPhone6 and iPhone 6 Plus

or this

http://mydevice.io/devices/

Community
  • 1
  • 1
amir
  • 121
  • 1
  • 1
  • 4

3 Answers3

6

iPhone 7 has same device width/height as the iPhone 6: 375x667 iPhone 7 plus according the same: 414x736

Dr. Lemon Tea
  • 549
  • 4
  • 13
  • how you dedect in js if it's iphone 6 or iphone 7? – amir Nov 10 '16 at 07:47
  • 1
    maybe pixel ratio can help you out. Try with window.devicePixelRatio – Venkatesh Nadar Feb 07 '17 at 11:36
  • @amir it is possible with matchmedia. it works on every new browser down to IE10. as you can see on can i use here: http://caniuse.com/#feat=matchmedia more infos about matchmedia: https://developer.mozilla.org/de/docs/Web/API/Window/matchMedia – nonnnnn Mar 16 '17 at 19:22
2

You can easily detect your device CSS width and height by single clicking this link: http://viewportsizes.com/mine/

For iPhone 6 its 375px X 667px
For iPhone 6+ its 375px x 667px
For iPhone 7 its 375px X 667px
For iPhone 7+ its 414px x 736px

Kapil Kshirsagar
  • 282
  • 1
  • 4
  • 19
  • 1
    6 Plus is 375⨉667 and 7 Plus is 414⨉736 according to https://developer.apple.com/library/content/documentation/DeviceInformation/Reference/iOSDeviceCompatibility/Displays/Displays.html – Bennett McElwee Feb 14 '18 at 04:55
1

The iPhone 7 Plus is 414 x 736 according to Apple: https://developer.apple.com/library/content/documentation/DeviceInformation/Reference/iOSDeviceCompatibility/Displays/Displays.html

Bennett McElwee
  • 24,740
  • 6
  • 54
  • 63