在 HTML5 中设置透明颜色
是否可以为 HTML5 中加载的图像设置透明颜色?
我会寻找类似于 SDL 中可用的 setColorKey() 函数的东西。这将用于轻松地从我将使用的一些精灵表中删除背景。
Is it possible to set a transparent color for images loaded in HTML5?
I would be looking for something similar to the setColorKey() function available in SDL. This would be used to easily remove a background from some sprite sheets that I will be using.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
没有非常简单的方法来执行此操作,但您可以使用
标记来执行此操作。
使用
drawImage
在画布中绘制图像,然后使用getImageData
和putImageData
对其执行像素操作。这里有一些画布中像素操作的示例:https: //developer.mozilla.org/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Drawing_shapes
There is no very straightforward way to do this, but you can use the
<canvas>
tag to do this.Draw your image in the canvas, using
drawImage
, and then usegetImageData
andputImageData
to perform pixel manipulation on it.There are some examples of pixel manipulation in canvas here: https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Canvas_tutorial/Drawing_shapes
没有为此的内置函数。如果这不需要是动态的,那么您可以从原始图像中删除颜色并使这些区域透明。然后,将图像放入具有刚刚从图像中删除的背景颜色的 div 中。之后,当您将鼠标悬停在图像上时,可以更改 div 的背景颜色。
如果这听起来是正确的想法并且您需要一些入门代码,请告诉我。
There is no built in function for this. If this doesn't need to be dynamic, then you could remove the color from the original image and make those areas transparent. Then you put the images in a div that has the background color that you just removed from the image. After that you change the background color of the div when you mouse over the image.
If that sound like the right idea and you need some starter code let me know.