Microsoft png filters

[moesian]

Hi,

Ive used these filters before to use *png files in internet explorer.

#pageTop {
height:22px;
width:798px;
margin:0 auto;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='img/pageTop.png');

}

#pageTop[id] {background: url("img/pageTop.png");}

This sort of thing.

However now I'm doing a template for a blog and the png files arent showing up in explorer. I was wondering if someone could tell me before I carry on wether it is something to do with the fact that the site is being loaded using a database or something.

The last page I used these on was a static page.

Thanks alot

[Dabrowski]

Is your CSS copied & pasted from your code? Missing ',' after 'sizingMethod=scale'.

FYI IE7 doesn't require this hack, it handles PNGs correctly. Don't know what version of explorer you are referring to.

[moesian]

Hi,

Im using IE6. I put the ',' in but it doesnt seem to have helped.

Do you know of a way of using *.pngs in IE that will work with ealier versions of IE whilst not interfering with their use in IE7?

[Dabrowski]

I wrote a script to handle normal IMG tags, for background tags I have used your method, the only difference being I either use alphaImageLoader OR background, not both. Try taking the background URL out and see what happens.

For each CSS I use I have a variation for IE6, IE7, and Moz, a little JS inserts the correct one. Then I add the browser specific modifications there, it keeps the original CSS much tidier.

[Xapti]

Adding the png filter for jsut IE 6, you can use conditional comments.

[Dabrowski]

Thanks xapti, I know this but prefer to keep conditional things out of my markup.

moesian, if the script I sent you doesn't work for background then you could use a DIV, absolute position the same size as your content, and stick the img tag in there. That should shift it behind your text.

[Xapti]

Thanks, but...

I was replying to the following:

Do you know of a way of using *.pngs in IE that will work with ealier versions of IE whilst not interfering with their use in IE7?

Granted,if he wants to do what you do, then he'd be in the same position. I, as well as many (we both know not too many though) others, have their javascript disabled unless required (NoScript extension), so browser detection that way isn't always the finest (granted if something's broken on the page, I'll then enable JS, but it's several seconds wasted).

[edited by: Xapti at 5:26 am (utc) on April 1, 2007]

[Dabrowski]

A good point that brings us to the age old discussion of is there a stat for % of people who disable JS?

Unfortunately I don't believe there is.

But I believe in the fact that the majority of people are end users who have JS turned on because it's default, and that they don't turn it off cos they don't know what it is.

I just prefer 1 line of JS in my code than several lines of CSS hacks. It's personal preference of course, there is no right or wrong answer.

[Achernar]

If you are to add one line of js code, why not add one line of CC instead? This has the advantage to work even if js is disabled.

[Dabrowski]

I actually use a combination of the 2, on larger sites I have done a generic fix doesn't always work entirely, or there are places you want to exclude it. On these sites I do use condition statements, I guess whichever way is easier and suits the purpose.

That aside, Moesian, did the script I sent you work ok?

[Achernar]

moesian,

Try

sizingMethod=image

And add a css rule hack to disable background for IE6 and lower.
Try (with the leading underscore) :

_background: none !important;

[moesian]

Hi everyone,

Thanks for all the help the javascript worked great but I had a few problems with backgrounds on list items, I guess I can work around this by adding images inside the items.

Seems a bit wierd I cant seem to load the javascript from an external file, but it works fine if I place it directly in the site code.

It's a wordpress theme I'm working on, as you lot can probably guess I'm just starting out.

Is there any reason the I wouldn't be able to load a script form an external file or that the css hack I was using on static pages would load on a php generated site like a wordpress blog?

[Dabrowski]

It should work from an external file, I always do it that way.

<script src='/js/fixpng.js'></script>

(assuming the script is in a folder called 'js' of course)

Sure you got the path right?