html - Dynamic "apple-touch-icon" on Android devices? -


i have html mobile web app uses single source of code multiple branded sites. each "site" needs have own "apple-touch-icon.png" used when site bookmarked home screen. can work on ios, not android.

we using angular.js our project, i've tried specifying dynamic paths in index.html file directly, example:

  <link rel="apple-touch-icon" sizes="144x144" ng-href="/icons/144/{{bankid | lowercase}}-apple-touch-icon.png">   <link rel="apple-touch-icon-precomposed" sizes="144x144" ng-href="/icons/144/{{bankid | lowercase}}-apple-touch-icon.png"> 

this works on ios, not on android.

i've tried appending tags via jquery, example:

$('head').append('<link rel="apple-touch-icon" sizes="144x144" href="/icons/144/'+bankid+'-apple-touch-icon.png">' + '<link rel="apple-touch-icon-precomposed" sizes="144x144" href="/icons/144/'+bankid+'apple-touch-icon.png">'); 

this works on ios, though there noticeable delay icon populated. again, doesn't work in android.

if leave apple-touch-icon.png in root folder, android find it, won't work need dozen different possible icons.

could suggest how else done?


Comments

Popular posts from this blog

node.js - Bad Request - node js ajax post -

Why does Ruby on Rails generate add a blank line to the end of a file? -

keyboard - Smiles and long press feature in Android -