I found this article on how to create a Mega dropdown using jQuery. http://www.sohtanaka.com/web-design/mega-drop-downs-w-css-jquery/. It works great, however when I customize the look of it and use a PNG as a background, it puts a black border around the image. This is happening in IE 6,7, and 8. I have tried many PNG fixes that I found on the web and nothing seems to be working. I know that PNG's work fine in IE 7 and 8, but it seems to not work when I involve jQuery into the mix.
- Got a link?
- a link would really help :)
2 answers
points
Sorry I should have been more clear. It's not really a border, it turns any Transparent PNG image I use that has a shadow on it, and make it all black and not transparent. It doesn't render the transparent image well at all in IE6, IE7, and IE8
points
You need to be exporting your PNG graphics as 24-bit with transparency and the appropriate canvas color in Photoshop and 32-bit in Fireworks.
- Want to post one of your PNG image files so I can double-check what I'm telling you? :)
- 8-bit PNGs only offer the same transparency as GIF files, for full alpha-transparency (suitable for fading/gradiated shadows) they should be 24 bit from Photoshop or 32 bit from Fireworks...
- There's an app called TweakPNG that will take out the 'offending' data in your .png, namely the gAMA chunk, so it works in IE6 to 8. The site for the app: http://entropymine.com/jason/tweakpng/. Could you post your code so we can take a look?
- you can also use PngOptimizer too, with added compression ;) http://psydk.org/PngOptimizer.php
- Thanks for correcting my mistake there danwellman. I've corrected the information to be accurate. Cheers!