This is not late breaking news and certainly not something I'll take any credit for but would like to make it a little more widely known...
Until I came across this mod, the only real options I had to view my site with fully transparent PNG images was to use Mozilla, Opera or other browser as Internet Explorer doesn't support them. Let's face it - and regardless of your opinion on the subject, you have to cater for Internet Explorer as so many people use it.
This little mod allows you to use IE (5.5 or later) and view full transparency PNG images on your Nuke (or other) site and reap the rewards and eye candy that PNG images offer. No more nasty lines around your GIF's as you switch from a dark them to a light one!
It's very simple to use and can be seen in action on my site www.ats-online.org as a working example. All of my topic icons, the rank images and a few others are PNG files and display beautifully - regardless of what theme I use.
I've made the files and instructions available for download HERE if anyone wants them.
Location: Arizona (USA) Site Admin: Lenon.com Admin: Disipal Designs
Posted:
Sat Jan 08, 2005 12:37 pm
Hrm...
I make transparent .PNG's all the time. As a matter of fact, I use .PNG 99.9% of the time for all my graphics. Generally speaking, I can make .PNG graphics smaller and better looking than .GIF's.
Here's an example (10k):
Does the above graphic work in you in IE? If so, let me know and I'll tell you how I do it...
I use Paint Shop Pro for all my graphic work - piece of cake!
Location: Arizona (USA) Site Admin: Lenon.com Admin: Disipal Designs
Posted:
Sat Jan 08, 2005 1:38 pm
I noticed this thread has a lot of 'views', so I thought I'd better just go ahead and let 'er rip...
In a nutshell:
Open an image file in Paint Shop Pro.
Do all your cropping, editing, et cetera, just like normal. When you get the image where you want it, and you want to save it as a transparent .PNG
Right-click the 'eyedropper tool' over the background color you want to make transparent. This places the background color in the background 'color swatch'.
Now go to File=>Export=>Transparent=>PNG Optimizer.
The PNG export dialog box looks almost identical to the GIF export box except you have more 'true color' settings available to you. Control file size by trying different color palettes, transparency, and format settings.
'Export'ing files is always preferable to merely Save'ing them in PSP, due to the control you have over the final image. Exporting lets you adjust transparency settings, format, color settings, how to blend partials, image download time in various usages, yada, yada, and you can preview the image as you make settings changes.
The selected background color will now be showing in the 'color swatch' on the Transparency tab. If you select the 'Areas that match this color' option, it will automatically make all matching pixels transparent and show the results in the preview window. You can adjust the tolerance until the edges of the image look the way you want.
The higher the tolerance number, the more pixels are added to the transparency and the less 'halo' of blending between image and background. However, it also increases the size of the file, so shoot low if you want to create small files. Dittos for your other settings too!
Choose existing transparency or areas that match this color. Click ok. Then it will let you name and save.
Sometimes pictures are worth 1000 words, so here are a couple of visuals for you, showing the settings I use...
Note the size of the Uncompressed image vs. Compressed image!
Back to the original topic...providing transparent PNG support in IE...
I've managed to find a workaround hack for allowing IE to properly display transparent PNGs. It is based upon a known workaround which uses a 1*1 GIF to be displayed and then replaced dynamically by the IE rendering engine (details elsewhere). I did not develop this; while the instructions found elsewhere work while developing your own site, it was difficult (for me) to adapt to the Nuke framework.
I have no way to attach the solution with this forum, but I will try to find an alternative. The solution is very, very simple to implement. Not ideal, as it requires JavaScript to be enable in the client's IE, but it is the best solution I've found, and works extremely well considering IE's limitations.
HTH YMMV
update: here's a link to the package I used. I don't know how long this link willlast, it's not my site, but they have it.
I believe that's the origins of the fix I've included (png_graphics.zip, aka 'sleight')
Create any *24* bit png with Alpha Transparency (the instructions in your previous post are *not* for 24bit RGBA, but for 8-bit. 8-bit leave the undesirable 1-pixel anti-aliased 'halo' around the image just like a GIF does ). IE will not use the apha channel info for transparency.
Webx Nuke Cadet
Joined: Jun 29, 2005
Posts: 1
Posted:
Tue Jun 28, 2005 9:16 pm
Hi guys, I did some googling and ran across your site for the initial phase of the transparent .png idea coupled with some PHP and I have it working pretty nice. The one area however that I cannot get to work for the life of me, is the simple carriage return or new line.
When I use \n or even \r the image outputs a rather odd y character.
I tried to use a number code as well from php.net from some of the documentation on the image function, but to no avail.
Basically, what I have is:
$mytextstring = "$var_1 $var_2";
What I would like to be able to do with the transparent .png file is:
I noticed the above examples and they do have a carriage return if my eyes are not deceiving me. If I could just get this question answered, I might actually be able to sleep at night..lol..I have been pulling my hair out all night over this one and so far no luck.
You cannot post new topics in this forum You cannot reply to topics in this forum You cannot edit your posts in this forum You cannot delete your posts in this forum You cannot vote in polls in this forum
