CSS: -webkit-mask-image

Question

I\'m using the CSS property

-webkit-mask-image

To apply a mask over an image. However, in chrome, the mask moves as you scroll the image o

Answer 1

Replace your data with an image-file url

-webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);

About your situation, there is this issue on chromium reported by mihaip@chromium.org, Aug 26, 2013 : http://code.google.com/p/chromium/issues/detail?id=279319 and this one about similar subject http://code.google.com/p/chromium/issues/detail?id=99052

For complement of info : -webkit-mask-attachment: No more supported in Chrome 24 and later. Supported in Safari 4.0.