Photoshop Help
 
Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
User Name:
Password:
Remember me

The Shed is going Social! Join us on FaceBook and Twitter and chime in on the conversation.

Go Back   Dev Shed ForumsWeb DesignPhotoshop Help

Reply
Add This Thread To:
  Del.icio.us   Digg   Google   Spurl   Blink   Furl   Simpy   Y! MyWeb 
Thread Tools Search this Thread Rate Thread Display Modes
 
Unread Dev Shed Forums Sponsor:
  #1  
Old October 9th, 2003, 07:49 PM
lisajill lisajill is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
 
Join Date: Aug 2003
Posts: 152 lisajill User rank is Private First Class (20 - 50 Reputation Level)lisajill User rank is Private First Class (20 - 50 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 10
Send a message via ICQ to lisajill Send a message via AIM to lisajill Send a message via Yahoo to lisajill
assistance with transparent background

heya all,

i've done a search on the forums and google and altho i've tried many of the tutorials i can't seem to get the effect that i want.

i am trying to make a 'square' that will tile, it has one color (something close to cccc99, but i've just been clicking any brown for now, trying to get this to work).

thats the entire image.

i want this to be transparent - the end goal is to have a transparent background image that will go over a normal image on my site.

you can see this (without the transparency, and very messed up) on my test site at:

http://www.lisa-jill.com/categories/test/ - in the right column choose 'transparent'

with photoshop, i set the opacity to 80% and then saved it - i had the transparency box ticked and it looked like it saved ok, but then when i view it with anything else, its 100% opaque.. i'm not sure where I'm going wrong but I'm terrible with photoshop so i'm not surprised.

if someone can either tell me how to do this or point me to a tutorial for this specifically, i'd be greatly appreciative

i was doing this using moz-filter-opaciy and alpha-filter in css but that wasn't cross browser compatable, only ie happy, so i'd rather use a graphic.

thanks for any help =)
__________________
Lisa
distant, early morning

Reply With Quote
  #2  
Old October 9th, 2003, 08:19 PM
SammyK's Avatar
SammyK SammyK is offline
Happy Monkey
Dev Shed Intermediate (1500 - 1999 posts)
 
Join Date: Nov 2001
Location: UK (University of Kentucky)
Posts: 1,810 SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level) 
Time spent in forums: 4 Days 7 sec
Reputation Power: 46
With gif images, it is either completely transparent, or a solid color. As far a gif's are concerned, there is no such thing as "transparent opacity."

Now, PNG's will do the affect you are looking for. Just save it as a png, not a gif.
__________________

Reply With Quote
  #3  
Old October 9th, 2003, 08:22 PM
lisajill lisajill is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
 
Join Date: Aug 2003
Posts: 152 lisajill User rank is Private First Class (20 - 50 Reputation Level)lisajill User rank is Private First Class (20 - 50 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 10
Send a message via ICQ to lisajill Send a message via AIM to lisajill Send a message via Yahoo to lisajill
there's a png up there currently - it was definitely transparent in ps but now its not.... as you can probably see =)

what i did was to create the image - a rectangle with the color you see, the image was transparent and 3x2 - i chose 80% opacity

then i did a save for web - i chose png 24 and clicked 'transparent' - it still looked right in ps - now on my page and viewed using picture viewer - it isnt' transparent

i'm obviously doing something wrong, i just don't know what

Reply With Quote
  #4  
Old October 9th, 2003, 09:16 PM
SammyK's Avatar
SammyK SammyK is offline
Happy Monkey
Dev Shed Intermediate (1500 - 1999 posts)
 
Join Date: Nov 2001
Location: UK (University of Kentucky)
Posts: 1,810 SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level) 
Time spent in forums: 4 Days 7 sec
Reputation Power: 46
Not all browsers will support png tranz.

Take the test here:

http://entropymine.com/jason/testbed/pngtrans/

Reply With Quote
  #5  
Old October 9th, 2003, 09:17 PM
lisajill lisajill is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
 
Join Date: Aug 2003
Posts: 152 lisajill User rank is Private First Class (20 - 50 Reputation Level)lisajill User rank is Private First Class (20 - 50 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 10
Send a message via ICQ to lisajill Send a message via AIM to lisajill Send a message via Yahoo to lisajill
and jpegs can't either be semi transparent?

so i can either continue this non-cross browser compatabilty or give it up til css3 is more widely supported?

sigh, oh well I'll give that theory up then =)

thanks everyone!

Reply With Quote
  #6  
Old October 9th, 2003, 09:22 PM
SammyK's Avatar
SammyK SammyK is offline
Happy Monkey
Dev Shed Intermediate (1500 - 1999 posts)
 
Join Date: Nov 2001
Location: UK (University of Kentucky)
Posts: 1,810 SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level) 
Time spent in forums: 4 Days 7 sec
Reputation Power: 46
Wait! I found a way to make it work in IE:

http://www.alistapart.com/stories/pngopacity/

Reply With Quote
  #7  
Old October 9th, 2003, 09:28 PM
lisajill lisajill is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
 
Join Date: Aug 2003
Posts: 152 lisajill User rank is Private First Class (20 - 50 Reputation Level)lisajill User rank is Private First Class (20 - 50 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 10
Send a message via ICQ to lisajill Send a message via AIM to lisajill Send a message via Yahoo to lisajill
still the same problem tho; especially since i use mozilla and woulod like to see it the wa most people do =)

thanks for the help / researh i do appreciate it!

Reply With Quote
  #8  
Old October 9th, 2003, 09:31 PM
SammyK's Avatar
SammyK SammyK is offline
Happy Monkey
Dev Shed Intermediate (1500 - 1999 posts)
 
Join Date: Nov 2001
Location: UK (University of Kentucky)
Posts: 1,810 SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level)SammyK User rank is Sergeant Major (2000 - 5000 Reputation Level) 
Time spent in forums: 4 Days 7 sec
Reputation Power: 46
Sure thing. I use Mozilla also. I wish everyone used Mozilla.

Reply With Quote
  #9  
Old October 9th, 2003, 09:56 PM
lisajill lisajill is offline
Contributing User
Dev Shed Newbie (0 - 499 posts)
 
Join Date: Aug 2003
Posts: 152 lisajill User rank is Private First Class (20 - 50 Reputation Level)lisajill User rank is Private First Class (20 - 50 Reputation Level) 
Time spent in forums: < 1 sec
Reputation Power: 10
Send a message via ICQ to lisajill Send a message via AIM to lisajill Send a message via Yahoo to lisajill
amen *grins*

Reply With Quote
Reply

Viewing: Dev Shed ForumsWeb DesignPhotoshop Help > assistance with transparent background

Developer Shed Advertisers and Affiliates



Thread Tools  Search this Thread 
Search this Thread:

Advanced Search
Display Modes  Rate This Thread 
Rate This Thread:


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

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
View Your Warnings | New Posts | Latest News | Latest Threads | Shoutbox
Forum Jump

Forums: » Register « |  User CP |  Games |  Calendar |  Members |  FAQs |  Sitemap |  Support | 
  
 


Powered by: vBulletin Version 3.0.5
Copyright ©2000 - 2013, Jelsoft Enterprises Ltd.

© 2003-2013 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap