Current location: Hot Scripts Forums » General Web Coding » HTML/XHTML/XML » making background of JPG image transparent with Photoshop CS2


making background of JPG image transparent with Photoshop CS2

Reply
  #1 (permalink)  
Old 02-24-08, 02:20 PM
crmpicco's Avatar
crmpicco crmpicco is offline
Wannabe Coder
 
Join Date: Jan 2005
Posts: 124
Thanks: 0
Thanked 0 Times in 0 Posts
Unhappy making background of JPG image transparent with Photoshop CS2

I created a JPG with Photoshop CS2 as seen at the following URL: http://www.ayrshireminis.com/mini/en/galleries2.php - it's the "Add A Mini" button :-)

I have been updating the site and have changed the background colour of the table that the image is in, however I have now realised that I did not make the button with a transparent background :-(

Is it possible to use CS2 to edit the JPG to make the background transparent?



Picco
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiShare on FacebookShare on Stumble UponShare on Twitter
Reply With Quote
  #2 (permalink)  
Old 02-24-08, 02:25 PM
Nico's Avatar
Nico Nico is offline
Community Leader
 
Join Date: Sep 2005
Location: Spain
Posts: 8,074
Thanks: 11
Thanked 88 Times in 83 Posts
No, JPEG images don't support transparent backgrounds. Only GIF and PNG images do. (Some older browsers don't support PNGs with transparent backgrounds, though. Like IE 6 and below).
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiShare on FacebookShare on Stumble UponShare on Twitter
Reply With Quote
  #3 (permalink)  
Old 03-17-08, 04:49 PM
JeffCT JeffCT is offline
Newbie Coder
 
Join Date: Mar 2008
Location: Phoenix, AZ
Posts: 14
Thanks: 0
Thanked 0 Times in 0 Posts
Quote:
Originally Posted by crmpicco View Post
I created a JPG with Photoshop CS2 as seen at the following URL: http://www.ayrshireminis.com/mini/en/galleries2.php - it's the "Add A Mini" button :-)

I have been updating the site and have changed the background colour of the table that the image is in, however I have now realised that I did not make the button with a transparent background :-(

Is it possible to use CS2 to edit the JPG to make the background transparent?



Picco
Can't be done, the JPEG format doesn't support transparency. I would recommend a PNG for this.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiShare on FacebookShare on Stumble UponShare on Twitter
Reply With Quote
  #4 (permalink)  
Old 03-17-08, 04:57 PM
Nico's Avatar
Nico Nico is offline
Community Leader
 
Join Date: Sep 2005
Location: Spain
Posts: 8,074
Thanks: 11
Thanked 88 Times in 83 Posts
I wish I would have thought of that.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiShare on FacebookShare on Stumble UponShare on Twitter
Reply With Quote
  #5 (permalink)  
Old 03-18-08, 07:09 AM
JeremyTM JeremyTM is offline
Newbie Coder
 
Join Date: Mar 2008
Posts: 10
Thanks: 0
Thanked 0 Times in 0 Posts
Can you make the background the same color as the other image? This might help you.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiShare on FacebookShare on Stumble UponShare on Twitter
Reply With Quote
  #6 (permalink)  
Old 03-23-08, 03:21 PM
crmpicco's Avatar
crmpicco crmpicco is offline
Wannabe Coder
 
Join Date: Jan 2005
Posts: 124
Thanks: 0
Thanked 0 Times in 0 Posts
I have been trying to change the background colour of the image that I have on my page at http://www.ayrshireminis.com/mini/de/galleries.php - the exact image is http://www.ayrshireminis.com/mini/images/addmini_de.jpg

I am using Photoshop CS2, I have opened the image and then highlighted the area that I want to make transparent (with the Magic Wand), then went to Help > Export Transparent Image and then went through the wizard and exported it as a GIF (for compatibility) - but the colours come out terrible - only 8bit, so nothing like what the image is originally. How can this be done in CS2?

Picco
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiShare on FacebookShare on Stumble UponShare on Twitter
Reply With Quote
  #7 (permalink)  
Old 03-23-08, 09:52 PM
crmpicco's Avatar
crmpicco crmpicco is offline
Wannabe Coder
 
Join Date: Jan 2005
Posts: 124
Thanks: 0
Thanked 0 Times in 0 Posts
ok, i've also tried to save it as a PNG to begin with then save that image as a GIF, but it just destroys the colour and kicks it to 8-bit :-(

I know this can be done through the GIMP, but can it be done with PS CS2?

Picco
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiShare on FacebookShare on Stumble UponShare on Twitter
Reply With Quote
  #8 (permalink)  
Old 03-24-08, 02:47 AM
jfulton's Avatar
jfulton jfulton is offline
Community VIP
 
Join Date: Apr 2006
Location: Los Angeles, CA
Posts: 660
Thanks: 0
Thanked 0 Times in 0 Posts
Play around with the export settings, but you're probably going to get the best results using a PNG-8 format.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiShare on FacebookShare on Stumble UponShare on Twitter
Reply With Quote
  #9 (permalink)  
Old 03-24-08, 09:06 AM
crmpicco's Avatar
crmpicco crmpicco is offline
Wannabe Coder
 
Join Date: Jan 2005
Posts: 124
Thanks: 0
Thanked 0 Times in 0 Posts
can't save it as a PNG though mate, as IE6 < won't show it :-| - which I have thought is pretty poor from a browser that is still widely in use. Am I going to have to install the GIMP?

Picco
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiShare on FacebookShare on Stumble UponShare on Twitter
Reply With Quote
  #10 (permalink)  
Old 03-24-08, 10:09 AM
TheKiser TheKiser is offline
Wannabe Coder
 
Join Date: Aug 2007
Location: Texas
Posts: 151
Thanks: 0
Thanked 0 Times in 0 Posts
Quote:
Originally Posted by crmpicco View Post
can't save it as a PNG though mate, as IE6 < won't show it :-| - which I have thought is pretty poor from a browser that is still widely in use. Am I going to have to install the GIMP?
Picco,

This just a WAG but see if there are settings for exporting to .GIF it sounds like it is restricted 8-bit colors. Also, you might want to check the help, it should tell you of the various restrictions and how to (or that you can't) change them.
__________________
6 Steps to Successfully Solving Problems:
Step 1: RTFM ............................. Step 4: Post in ProgrammingTalk
Step 2: See Step 1. ................... Step 5: Wait for answers.
Step 3: See Step 2. ................... Step 6: While Waiting RTFM.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiShare on FacebookShare on Stumble UponShare on Twitter
Reply With Quote
Reply

Bookmarks


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
Converting to ems spyke01 CSS 0 11-09-07 03:48 PM
Detecting image name and making image. npsken Script Requests 0 08-14-06 09:06 PM
Background image for iframe same as main page riots HTML/XHTML/XML 6 02-17-06 12:22 PM
PHP Script to Insert Dynamic Txet into Jpg image cyborlink PHP 3 05-05-05 06:26 AM
rollovers using a background image pagetta CSS 6 04-04-05 04:25 PM


All times are GMT -5. The time now is 11:54 PM.
vBulletin® Copyright ©2000 - 2012, Jelsoft Enterprises Ltd.