2011-06-06 55 views
4

我正在處理我的投資組合,並且我想用一個PNG掩蓋一些圖片,這與webkit圖像蒙版一起工作,但是,我希望在Opera中有相同的結果,您是否知道JavaScript腳本有相同的結果?JavaScript中的CSS webkit-image-mask替代方法?

我試過edge.js,但只能在<img></img>下工作,而不是在CSS背景下(我做了sprite)。

謝謝。

+0

PNG圖像掩模!?我甚至不知道這是一個功能。 +1將其引起我的注意! – 2011-06-24 14:16:58

回答

0

爲什麼不簡單地在您的圖像上顯示PNG?

您可以在圖片後創建HTML中的元素,或者使用JS創建它。

只需在圖像頂部創建一個DIV和絕對位置,然後將圖像的寬度和高度(或任何您喜歡的圖像)與PNG作爲div的背景圖像進行比較,這些都通過CSS實現。

您還可以使用CSS類型::after僞類來對元素進行樣式設置,而無需通過HTML或JS將其插入到DOM中。

http://jsfiddle.net/LuSYQ/1/

::after替代

http://jsfiddle.net/LuSYQ/11/