使图像的一部分透明 [英] Make part of a image transparent

问题描述

大家好，



考虑我的网页上有两张图片（一张在其他图片上，使用Z-index定位）。

现在，我想选择顶部图像的部分（矩形），并且所选部分应该变得透明，以便在该透明区域中，我可以看到下面图像的一部分。



我尝试使用许多jquery裁剪插件但没有用。

这是不可能的或者有没有办法用CSS，javascript和Jquery做这个？



感谢您的帮助。

Praveen。

Hi Guys,

Consider i have two images on my webpage(one over other, positioned using Z-index).
Now, I want to select part(in rectangular shape) of a top image, and that selected part should become transparent so that in that transparent area, I can see part of a below image.

I tried using many jquery cropping plugins but no use.
Is this impossible or Is there any way to do this using CSS,javascript and Jquery?

Thanks for your help.
Praveen.

推荐答案

放置底部怎么样？图像在顶部而不是真正在下面，当您选择一个矩形，将其大小设置为所选矩形的大小。它的背景位置必须与矩形偏移和顶部和左边的填充相匹配，使它看起来像是在正确的位置。



这样你就不必改变它图像本身只是改变了一些css属性。

How about placing the "bottom" image on top instead of making it really underneath and when you select a rectangle setting its size to the size of the selected rectangle. Position of its background must match the rectangles offset and padding top and left to make it look as it was in the correct place.

This way you dont have to change the image itself just change few css properties.

这篇关于使图像的一部分透明的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！