Mobile app version of vmapp.org
Login or Join
Michele215

: How to save Photoshop file with for web with partial transparency over transparent background? I have an image in my program which I want to superimpose against a background. However, the image

@Michele215

Posted in: #AdobePhotoshop #Png

I have an image in my program which I want to superimpose against a background. However, the image will move around and I need the background image to remain in place while the front image moves. Furthermore, the front image has a dropshadow which I have created in photoshop.

In order to allow the front image to move around, have a dropshadow, and have the background image remain in place, I have set the background for the front image to be transparent.

I am "saving for web" now to PNG-24. However, Photoshop continually turns the transparent pixels either to be white or black - with no real alpha transparency. What should I do?

Here is the image itself:



And here is the image, superimposed over the background, in my program itself: (The key to notice is that in the top-right of the image, the drop shadow turns to white, overlaying and obscuring the background texture.)



What's the best way to solve this issue? I want it to look like this when all is said and done:

10.02% popularity Vote Up Vote Down


Login to follow query

More posts by @Michele215

2 Comments

Sorted by latest first Latest Oldest Best

 

@Lengel450

The image you posted already has the transparent background. When saving it (Save for Web and Devices) I don't think you selected transparency. Also it appears your image was saved as an indexed image.

10% popularity Vote Up Vote Down


 

@Si6392903

When in Photoshop, make sure you have the background layer turned off, then hit Ctrl+Shift+Alt+S and a box will come up "Save for Web and Devices."

Select "PNG 24" from the dropdown on the right and make sure the transparency checkbox is clicked, hit save, select your destination and then load it into your site.

PNG supports full transparency and alpha masks so it will look exactly as you like, and it will move around with no problems :)

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme