Created
April 20, 2015 20:50
-
-
Save gdibble/800d3e2bb9d8c1cb6d4e to your computer and use it in GitHub Desktop.
iOS Launch Image Loader - meta tags load every image (many large files slow app load/render); this loads only appropriate image
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
* iOS Launch Image Loader v1.1.1 @ GDibble | |
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * | |
* Browser downloads all meta-tagged images, thus only append 1 meta tag to | |
* save download time and provide the fastest loading mobile experience. | |
* | |
* Files must live in '/img/ios/' and named: | |
* startup-2048x1496.png Landscape Retina iPads | |
* startup-1536x2008.png Portrait Retina iPads | |
* startup-1024x748.png Landscape iPad 1 & 2 | |
* startup-768x1004.png Portrait iPad 1 & 2 | |
* startup-1242x2148.png Portrait Retina iPhone 6+ | |
* startup-750x1294.png Portrait Retina iPhone 6 | |
* startup-640x1096.png Portrait Retina iPhone 5 | |
* startup-640x920.png Portrait Retina iPhone 4 | |
* startup-320x460.png Portrait iPhone & iPod Touch | |
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */ | |
(function () { | |
function dynamicLaunchImage(prefix, extension) { | |
var resolution; | |
if (navigator.platform === 'iPad') { | |
if (window.devicePixelRatio === 2) { | |
//Retina iPads | |
if (window.orientation === 90 || window.orientation === -90) { | |
resolution = '2048x1496'; | |
} else { | |
resolution = '1536x2008'; | |
} | |
} else { | |
//iPad 1 & 2 | |
if (window.orientation === 90 || window.orientation === -90) { | |
resolution = '1024x748'; | |
} else { | |
resolution = '768x1004'; | |
} | |
} | |
} else if (window.devicePixelRatio === 3) { | |
//Retina iPhone 6+ | |
resolution = '1242x2148'; | |
} else if (window.devicePixelRatio === 2) { | |
if (window.screen.height === 667) { | |
//Retina iPhone 6 | |
resolution = '750x1294'; | |
} else if (window.screen.height === 568) { | |
//Retina iPhone 5 | |
resolution = '640x1096'; | |
} else { | |
//Retina iPhone 4 | |
resolution = '640x920'; | |
} | |
} else { | |
//iPhone & iPod Touch | |
resolution = '320x460'; | |
} | |
return prefix + resolution + '.' + extension; | |
} | |
var head = 'head'; | |
var headTag = document.getElementsByTagName(head); | |
var linkTag = document.createElement('link'); | |
linkTag.setAttribute('rel', 'apple-touch-startup-image'); | |
linkTag.href = '/img/ios/' + dynamicLaunchImage('startup-', 'png'); | |
if (!headTag.length) { //check if head tag exists, create otherwise | |
headTag = [ document.createElement(head) ]; | |
document.body.appendChild(headTag[0]); | |
} | |
headTag[0].appendChild(linkTag); | |
})(); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment