Removing default gloss on a WebApp icon.

Discussion in 'Mobile Web Development' started by Chasetastic, Jul 4, 2009.

  1. Chasetastic

    Chasetastic New Member

    Joined:
    Jul 4, 2009
    Messages:
    2
    Likes Received:
    0
    I'd like to know how to remove (on the web developer's side) the default gloss and faint borders applied when you add a WebApp to your homescreen.

    I know it's possible on AppStore app icons, and it also seems that the Gmail WebApp icon has no default gloss or borders. I'm sure it's as easy as adding a line of code to the html.

    Thanks!
  2. arcticfire

    arcticfire New Member

    Joined:
    Aug 4, 2009
    Messages:
    2
    Likes Received:
    0
    Device:
    2G iPod touch
    Its actually very easy

    ok so all you gotta do is add "-precomposed" to the link thing.

    here is an expample:

    What You Have, The Gloss And Borders:

    Code:
    [SIZE="4"]<link rel="apple-touch-icon" href="WorldWarAppTools.png" />[/SIZE]
    HTML:
    <link rel="apple-touch-icon" href="WorldWarAppTools.png" />
    What I Have, No Gloss And Borders:

    Code:
    <link rel="apple-touch-icon[COLOR="Red"][SIZE="6"][B]-precomposed[/B][/SIZE][/COLOR]" href="WorldWarAppTools.png" />
    HTML:
    <link rel="apple-touch-icon-precomposed" href="WorldWarAppTools.png" />
    and thats all.

Share This Page