Is there any simple way to display the icon for my iphone apps on my webpage the same way they look in the appstore (i.e. with the glass effect and preferably with reflection)? I have very little experience in web coding so some sample code that I could just copy and paste would be great if this is possible. Thanks for any help.
+2
A:
there is a great online generator that makes iphone looking icons for exactly this purpose:
Mobs
2009-11-26 07:12:20
If you only have a few icons to display on your webpage where manually processing them is realistic, I suggest you go this route. Otherwise I can post some of the resource files for masking icons and overlaying the glass effect that you could use to apply to icons in a more general fashion (say, if you had 10s or 100s of icons to display).
Sbrocket
2009-11-26 07:26:27
Or i suppose you could just take a screenshot of your app's icon in the app store....
Mobs
2009-11-26 07:31:33
Thanks for the suggestions, but I only have 8 icons atm so the manual solution is easiest in this case.
CG
2009-11-27 03:31:34
Changed my mind, just found out the reflection code only works in Chrome for me so most people won't see it. Looks awesome in Chrome though.
CG
2009-11-27 04:17:42
A:
Not the glass effect, but you can get the rounded corners and the reflection by using this CSS:
-webkit-box-reflect:below 0px -webkit-gradient(linear, left top, left bottom,
from(transparent), color-stop(0.8, transparent), to(rgba(0,0,0,0.5)));
-webkit-border-radius:12px;
-moz-border-radius:12px;
It only works for the reflection in WebKit-browsers (not yet all) and the rounded corners work in FireFox as well.
Johan Kool
2009-11-26 08:39:05
I would like to accept both answers here, since what I actually did was download the image from flavorstudios, fix it up, then use this reflection code. I picked this as the best since the site is a bit annoying in that you have to crop the image yourself and then redo the transparency. It takes < 1 min to do this but I had to base the choice on something. Thanks a lot to both of you.
CG
2009-11-27 03:29:51