How can I set a Java applet transparency to show contents behind it?

Question

I've got a web page with an applet inside. This applet is a drop target on a drag and drop action from the OS, I simply take an image from a folder, drag it on the applet and something happens.

I give this webpage to a graphic designer and he ask to if he can put an image behind the java applet so he can simulate to change the background using CSS (it is a skinned app and graphic design can change during execution).

Practically i supposed to do:

<div>
    <applet width="50" height="50" />
</div>

with this CSS:

div {
    width:50px;
    height:50px;
    background-image: url(image.jpg) center center no-repeat;
}

But it doesn't work (background is opaque).

It is possible to set transparency to the applet without loosing drag and drop capabilities ?

I'm searching something similar to flash wmode parameter.

Better solutions implies only changes on the CSS/HTML without recompiling java class so the designing team can change the page structure without changing the Java.

Answer 1

You might pass the background image URL into the applet as a parameter, or have the applet use Javascript to interrogate the page to determine what background image is shown.

Answer 2

It is not possible to make an applets background transparent, but you can use the alpha parameter of color to set transparency on components of the applet and to get the same background as the website you could pass the color or image as an applet parameter. However if it's an image, it will probably not be aligned like the site unless you position it fixed and pass the right part of the image.