17 August 2005, by Karl Bunyan
Solutions to the problem of PNG alpha transparency in IE6 have been around for a while... This solution uses script to write in the correct
html, or to pass variables to a script and set a property of an object.
Solutions to the problem of PNG alpha transparency in IE6 have been around for a while, as exemplified by this post on Cross-Browser Variable Opacity with PNG
on A List Apart. This solution uses script to write in the correct
html, or to pass variables to a script and set a property of an object.
Other solutions involve using server-side browser sniffing to serve
different CSS depending on the browser.
The crux of the problem is that IE6 doesn’t support the Alpha channel
of PNG files used as an image. The solution is to take advantage of one
of the proprietary DirectX filters built into Internet Explorer (for
Windows) and to use this instead of the background image. The important
point to note is that it is an ‘either/or’ solution - the PNG is used
as a background image for the other browsers, and as a filter source in
IE. Including both in IE means the PNG appears but with a nasty grey
where all the transparency should be.
I’ve come up with the JavaScript below as an instant fix solution which
means no rewriting of existing code is necessary. The CSS file will
contain the background image as supported by Firefox and the other (non
IE) modern browsers. (IE 7 is supposed to fix this, by the way.) The
JavaScript runs through the stylesheet and replaces all of the
background images with DirectX filters. The script should be placed in
the head of the page just after the stylesheet tags and works
automatically (although I haven’t yet tested it in older browsers).
You’ll need to remove some of the linebreaks which I’ve marked with a \n.
if(document.all&&document.styleSheets)
{
var stylesheets=document.styleSheets;
for(var i=0;i<stylesheets.length;i++)
{
var stylesheet=stylesheets[i];
var rules=stylesheet.rules;
for(var j=0;j<rules.length;j++){
var curRule=rules[j];
if(curRule.style.backgroundImage&&(curRule\n
.style.backgroundImage.indexOf('.png')>0)){
var imageName=curRule.style.backgroundImage;
imageName=imageName.substr(4,imageName.length-5);
curRule.style.backgroundImage='';
curRule.style.filter="progid:n
DXImageTransform.Microsoft.AlphaImageLoader(src='"+imageName+"')";
}
}
}
}
The way this works is to loop through each stylesheet, then
each rule in the stylesheet, looking for any one with the
backgroundImage property set. If it’s set it takes the image name from
it (stripping out the url('’) bit) and sets that as the source of a
DXImageTransform CSS filter. It then removes the backgroundImage
property.
August 17, 2005 at 10:57 am
Filed in: Front-end, CSS, Programming
No comments
3 August 2005, by Karl Bunyan
It's obviously a bit hacked together behind the scenes, as exemplified by the fact you can't do things like $this->getThing()->getOtherThing() without it barfing.
After working with PHP 5 for quite some time now, I’ve had to go back to PHP 4 to develop a CMS for a client’s site where we don’t have much over the hosting environment. Going back to the old version has annoyed me quite a few times already and it’s probably made worse by the fact that I never really did much PHP 4 anyway (I’m quite new to the language, even though I have been programming in it on and off for 2 years) and lately I’ve been working in a combination of PHP 5 and C# (as well as various others) and generally being a bit more object oriented about everything.
First off there’s the whole not really object orientedness of PHP 4. PHP 5 isn’t that object oriented, but PHP 4 is miles off. Passing variables by value instead of reference unless you put stupid & symbols everywhere… whose idea was that? Also it’s obviously a bit hacked together behind the scenes, as exemplified by the fact you can’t do things like $this->getThing()->getOtherThing() without it barfing. Instead you have to put the returned value from the first thing into a variable and then call the next method… not a good sign in an interpreter.
You can just about force yourself not to access member variables of objects directly, even if you can’t set things to be protected or private, and make get() and set() methods everywhere, but sometimes it’s really useful to put things into static classes. Database routines would be really useful, for example. Instead I’ve taken to creating a great big global variable to hold an object and refer to it everywhere and use the member variables of that object to store other useful objects. At least methods can be called statically, but without static member variables they’re not as much use. (I use a similar technique when programming in Lingo to save having to reference all my globals in each script: store them as properties of another object that keeps state for the whole application.)
And very little XML support either… Even ASP could handle XML well, and even XSL, four or five years ago, and ASP as we all know is the lowest form of programming language ever invented. (Okay, there are worse languages than VBScript, but not many that site behind so many important web sites. I once worked on a half million pound project that was built in ASP… Scary!)
Rant ends
August 3, 2005 at 10:40 am
Filed in: PHP, Programming
No comments
3 August 2005, by Karl Bunyan
The value of the position property in the original object will remain unaffected. This is quite rubbish. To get round it you need to get all the array keys and then create a separate variable to store a reference to the object you want to change.
PHP 4 doesn’t seem to create references for objects in foreach loops. e.g. the following will not change the original objects:
foreach($placeholder as
$contentBlock)
{
$contentBlock->setPosition(1);
}
The value of the position property in the original object will remain unaffected. This is quite rubbish. To get round it you need to get all the array keys and then create a separate variable to store a reference to the object you want to change:
foreach($placeholder as $key => $value)
{
$contentBlock =& $placeholder[$key];
$contentBlock->setPosition(1);
}
The variable $value isn’t used at all but if you’re stuck using PHP 4 then this is the best you can do. Luckily PHP 5 works much more sensibly, but we don’t always get a chance to use that so I’m stuck with this slightly messy alternative.
Foreach in the PHP docs
August 3, 2005 at 10:38 am
Filed in: PHP, Programming
No comments