I am using fancybox (http://fancybox.net/) for a new site i'm creating with inline divs 开发者_运维问答popping up when various things are clicked on and it all works great. I'm using one header image and one footer image (part transparent PNGs) at the top and bottom of my popup which have curved corners (with transparency behind them at the corners so you can see the background). The header image contains the top two corners and is the full width of the box and the footer image contains the bottom two corners. This works great in all browsers apart from IE7+, where the transparency in the top right and bottom 2 corners work fine but the top left corner transparency comes up in dark grey (not the normal light grey you see in IE6 when trying to use transparency without a pngfix). I have tried various png fixes but none of them have any effect in IE7+ (but make it work perfectly in IE6). I also read that there's a problem on IE when using transparent pngs as background images and setting the opacity, however i can't see this is a problem as the other three corners are working fine.
If anyone could shed any light on this then it would be much appreciated as i'm rather confused and don't know what else to try as it works in IE6 and all other browsers and the transparency works on the right side of the image but not the left and the bottom two corners (which use the same image as the top corners but just upside down) work perfectly in all browsers including IE. To make it even more confusing I tried using a gif image instead and exactly the same thing happens, on IE7+ the transparency works on the right side but not on the left and works fine everywhere else.i I tried posting on the fancybox google group but haven't had much luck so thought i'd see if anyone on here had any ideas!
Thanks so much for your help as ever everyone,
Dave
精彩评论