Webkit Masked iPhone Navigation →
There was a discussion on how to accomplish an iPhone like bottom nav element on the iPhoneWebDev Google Group and with a little help on the colors for the gradient I was able whip this example up. I’m quite happy with the outcome.
The only other thing I would like to do is handle various resolutions using -webkit-mask-size starting with a hi-res and scaling down for phones with a lower resolution.
This was my first attempt using -webkit-mask-image and other related properties and implementing it was a breeze. Check the source code for all the tasty tid-bits.
