Making a Png Image transparent in older versions of Internet Explorer

Question

Hello People i have a problem with the png formatted images, i used some PNG images in my mock. when i view the mock in I.E the background of the images are not transparent.

i got one solution for making it trasparent in "I.E" from the previous POSTS in the Forum. But my Problem is, i want that image to be tiled horizantlly...using that Filter thing.

can any one solve this plz....plz.... i need a solution for making a png in I.E and at the same time it shud be tiled horizontally.

Please write a comment if you down-vote an answer, especially if its by a newcomer. — , Jan 06 '11 at 07:54

score 0 · Answer 1 · edited May 23 '17 at 10:33

0

See this SO question for the transparency stuff.

To tile a background image horizontally use a CSS rule:

div {
    background-image: url('some_image.png');
    background-repeat: repeat-x;
}

edited May 23 '17 at 10:33

Community

1
1

answered Jan 06 '11 at 06:56

Marcus Whybrow

19,578
9
70
90

no there is a code for I.E that is, filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,src='name.png'); and i need the image tiling with this code. – GUNNOO Jan 06 '11 at 07:06
Maybe you could have mentioned that in your original question, and not just have writen plz a lot. I cannot help you there I don't know how to work with that. Also if you want a good answer, it requires a good question. – Marcus Whybrow Jan 06 '11 at 07:12

score 0 · Answer 2 · answered Jan 06 '11 at 07:46

Try this:

yourDiv {
background-image: url(name.png);
background-repeat: repeat-x;
_behavior: expression(
this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1],
this.style.background = "none",
this.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(
enabled=true, src=" + this.src + ")',
this.style.background-repeat: "repeat-x");
}

If doesn't work your options are:

Make your image bigger.
Use javascript to repeat the div containing it.
Make a jpg with the transparency effect baked.

P.D. Can you post the mockup of what you want to achieve?

Making a Png Image transparent in older versions of Internet Explorer

2 Answers2