PNG solution under IE6

Source: Internet
Author: User
I used PNGThe article "how to solve the background problems of images" describes how to use filters to solve the problem of background transparency, but does not solve loops and positioning. Under normal circumstances, IE6 does not support PNG images as the background. One is not transparent, the other is not positioned, and the third is not circular. Today, I have finally solved this problem by referring to the articles by comrades of the "Month" in the group.

1. Download iepngfix.zip,Click to download this file

There are three files: iepngfix.htcw.iepngfix_tilebg.js?blank.gif. Decompress these files and place them in the root directory of the website where PNG is used as the CSS background.

2. Add behavior: URL ("iepngfix. HTC"). This solves the PNG transparency problem.

When PNG is used as the background, a behaviro attribute is defined at the end of the CSS style.

# Login_main {
Background: URL (../img/main.png)Repeat 20% 50%;
Width: 739px;
Height: pixel PX;
Top: 12%;
Left: 20%;
Position: absolute;
Behavior: URL ("iepngfix. HTC ");
}

  The identifier in the URL is relative to index.htm, rather than the CSS file that defines the style.

3. Introduce the second Javascript file mentioned above in the HTM file. This solves the issue of PNG loop and locating.

<Script language = "JavaScript" src = "iepngfix_tilebg.js"> </SCRIPT>

Insert it into
Optimization:

I,We can imagine how large the computing scale is. No way, this is unavoidable. Vista and IE7 have come out for a long time, and there are excellent FF options. The share of customers who use IE6 will gradually decline. After you use IE7 to open htm, you can find that the pages that are perfect and do not need to be modified are loading very slowly in IE7. It seems that the behaviro attribute also affects IE7, internet Explorer 7 is also hard-working.

# Login_main {
Background: URL (../img/main.png)Repeat 20% 50%;
Width: 739px;
Height: pixel PX;
Top: 12%;
Left: 20%;
Position: absolute;
_Behavior: URL ("iepngfix. HTC ");
}

In this case, our goal is to release IE7 and check the hack of various browsers. We found that only IE6 can recognize the underscore "_" in CSS. therefore, we added an underline to behaviro In the CSS style. This underline is not parsed by FF or IE7, so that IE7 will ignore this CSS attribute and free IE7.

II,Since the goal of this processing is the IE6 browser, you can add a small change to the JS loading Statement on the homepage"<! -- [If IE 6]> <! [Endif] -->"Labels, not only for IE6, but also for other browsers, so that they ignore the iepngfix_tilebg.js file during page loading to improve efficiency. Poor IE6, let it accept the surging CPU consumption, no way, love can help.

<! -- [If IE 6]>
<Script language = "JavaScript" src = "iepngfix_tilebg.js"> </SCRIPT>
<! [Endif] -->

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.