Solve the problem of transparent picture without support png24 under IE6

Source: Internet
Author: User
Tags header html page relative version

There are two common solutions:

First: Use IE filter to solve

Key code:

CSS Code

_background:none;_filter:progid:dximagetransform.microsoft.alphaimageloader (src= "http://www.update8.com/Web/ Css/css/images/png24.png ", sizingmethod=" crop ");

There are a few points to note:

1: Here the corresponding SRC address must be relative to the HTML page is not relative to the CSS path.

2: Can only be used for a single PNG picture, meaning that background-position properties cannot be used.

3: Must add _background:none this paragraph.

Second: Use the Dd_belatedpng JS code.

The use of dd_belatedpng.js can be a perfect solution IE6 png picture transparency issues, and support Backgrond-position and background-repeat. This is not available in other ways, and Dd_belatedpng also supports a:hover properties, as well as .


How to use:

First download js file: 0.0.8a-min.js (compressed version) 0.0.8a.js (uncompressed version)
Then refer to the code in the page:



The reference function is Dd_belatedpng.fix (), and the CSS selector (which can be used with ID selector and class selector) and the application type (which is divided into IMG and background two) is filled in with PNG.

such as Dd_belatedpng.fix (' #box-one, img ') or Dd_belatedpng.fix ('. Header, background ').
More selectors such as Dd_belatedpng.fix (' #box-one,. Header, Img,background ');
Written dd_belatedpng.fix with hover effect (' #box-one, #box-one:hover ')

Note Some points:

First: Dd_belatedpng plug-in support backgrond-position and other positioning methods. So you can use "Sprite map"

Second: Dd_belatedpng supports the hover method, but must also write the class after hover into the fix method.



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.