Shulou(Shulou.com)06/03 Report--

What is the transparent method of png in ie6? in order to solve this problem, this article introduces the corresponding analysis and solution in detail, hoping to help more partners who want to solve this problem to find a more simple and easy way.

As the official website of the game pursues beauty in the design of the background and decorative characters of the page and wants to match the style of the game, this brings a lot of trouble to the front-end page creators. The production of a page is mainly spent on compatibility with ie6, and

Dd_belatedpng.js method

Import js file

The code is as follows:

Then carry on the class annotation to the elements that need to be transparent under ie6.

The characteristic is that it can solve the problem of transparency of png-24 to a great extent, but there are also several problems that are obvious.

1. The js file needs to be introduced.

two。 He will dynamically wrap a layer of css position:relative; elements on the png-24 image, making the original position:absolute; elements disappear or appear other unexpected bug.

Solution: add another layer of position:relative; dom elements to the png-24 image, or do not use absolute positioning or other methods.

Ie filter method

After the js method fails, you can use this method to make the picture transparent.

The code is as follows:

Background:url (/ images/game_box.png) 0 0 no-repeat;_background:none;_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader (src='/images/game_box.png',sizingMethod='crop')

Of course, the disadvantages of this approach are:

1. The performance of filters has always been a bottleneck for ie browsers.

2. Background-position cannot be implemented.

Picture replacement method

Without requiring background scrolling, you can use png-24 images in advanced browsers, then use the screenshot tool to capture the areas that need to be transparent, and then directly use the screenshot images.

The advantage of this method is that there is no compatibility problem, and it can be displayed normally under the condition of ensuring the size of the picture, but the disadvantage is that the operation is more complex, and the screenshot will also cause partial loss of the color information of the picture.

Browser discrimination method

Another way is to use js to determine whether it is ie6 and add different images after browsing. Use different pictures depending on the browser.

This method is used in products or interfaces that are more mature in the user market, regardless of low-end ie6 browser users, but also ensure that they can be displayed normally under the browser, but the quality of the picture is slightly worse.

The answer to the question about the transparent method of png in ie6 is shared here. I hope the above content can be of some help to you. If you still have a lot of doubts to be solved, you can follow the industry information channel to learn more about it.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.