Search code examples
cssimagecanvasmasking

Creating a transparency mask for html

Has anyone come across an effective way to mimic Webkit's 

-webkit-mask-box-image: url(filename.png)

functionality?

I'm trying to use non-square animated elements, and would prefer not having to do the masking on server-side.

I'm set on supporting at least Gecko and Webkit, but if I can manage Opera and IE, that would be a bonus.

Solution

  • After Googling a lot, seems there is no way to do this with anything other than webkit at the moment. Just pre-mask your images in Photoshop for now :)