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.



Related Article

Alibaba Cloud 10 Year Anniversary

With You, We are Shaping a Digital World, 2009-2019

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

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.