SitePoint Sponsor

User Tag List

Results 1 to 10 of 10
  1. #1
    SitePoint Member
    Join Date
    Feb 2001
    Posts
    16
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    okay heres a delima i got. i made an image for my website in photoshop. i saved it as a transparant gif and when i loaded it up.. there was a small white border going around the edge of the image. i'm guessing because the edges are a little feathered. any tips on how i can get rid of this feathered edge and make it so that when i save as a transparent gif it'll be transparant right up to the edge of the image?

  2. #2
    SitePoint Addict Drinky's Avatar
    Join Date
    Jan 2001
    Location
    England
    Posts
    338
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You could use a PNG with an alpha channel, but these almost never work in browsers properly :O) infact believe it or not, only netscape 6 (yes that's netscape 6) supports PNG's with alpha chnnels.
    Last edited by Drinky; Feb 11, 2001 at 16:31.
    Drinky

  3. #3
    SitePoint Wizard dominique's Avatar
    Join Date
    Dec 2000
    Location
    orbis terrarum
    Posts
    1,523
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    All I can think of is to edit the image again and make sure the border pixels are the same color as your transparent background color.

    Or cut the edges off if you can.

  4. #4
    Fire Bug Buginajar's Avatar
    Join Date
    Nov 2000
    Location
    DFW Metro
    Posts
    42
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    let me have the original and the primary background color and i can fix it up for you. I'll just load it up in photoshop and chage the matte color
    PyroGrafix Design Services
    Chris Hinkley
    buginajar@techisp.com

  5. #5
    ComDude CryingWolf's Avatar
    Join Date
    Dec 2000
    Location
    I don't know the cat drug it in!!!
    Posts
    247
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by Buginajar
    let me have the original and the primary background color and i can fix it up for you. I'll just load it up in photoshop and chage the matte color

    Instead of doing it for him why don't you post a reply that tells how to do this. I for one would like to know if it is easier then the way I use now. This would also help others here!!!

    Why catch a fish for someone when you can teach them to fish???


    late
    body { background:#000000; color:#000000 }
    HEY, WHO TURNED OUT THE LIGHTS?!?
    Easy come easy go!!!
    CryingWolf

  6. #6
    Blissed off
    Join Date
    Feb 2001
    Posts
    422
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The cause of this is: when a transparent gif is feathered or aliased, it need a little space *called the mat area* to feather into. to solve this dilemma, you can either

    1: Change the mat color in photoshop to closely match the background of the page.

    2: Turn off all aliasing and feathering on the object. Unfortunately, this will give you a fairly jagged edge object.

    Option one is normally your best bet. Photoshop can easily do this and I believe fireworks 4 can also *i think*

  7. #7
    Blissed off
    Join Date
    Feb 2001
    Posts
    422
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If you want to see a good example of option 1 from my previous message, check out this link from my site. The picture of the baby is a transparent gif with a dark green mat *a thin one* which blends nicely into the patterned background. This method takes a little care, but I think it's the best.

    http://www.totalnonsense.com/meesart.htm

  8. #8
    midnight coder
    Join Date
    Dec 2000
    Location
    The flat edge of the world
    Posts
    838
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    How do you change the mat colour in Photoshop?

  9. #9
    Blissed off
    Join Date
    Feb 2001
    Posts
    422
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If you are using photoshop 6, you go to the "save for web" option under the file drop down menu. You then select that you want to export it as a transparent gif. Once you do that, you will see and option on the right hand side that says "matte". You can choose the color you want it be from there. Hope this helps!

  10. #10
    ComDude CryingWolf's Avatar
    Join Date
    Dec 2000
    Location
    I don't know the cat drug it in!!!
    Posts
    247
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by wert
    If you are using photoshop 6, you go to the "save for web" option under the file drop down menu. You then select that you want to export it as a transparent gif. Once you do that, you will see and option on the right hand side that says "matte". You can choose the color you want it be from there. Hope this helps!
    This option seems to be available in photoshop 5.5 too
    body { background:#000000; color:#000000 }
    HEY, WHO TURNED OUT THE LIGHTS?!?
    Easy come easy go!!!
    CryingWolf


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •