search

Home >Web Front-end >JS Tutorial >The wonderful combination of opacity and JQuery under IE6

The wonderful combination of opacity and JQuery under IE6

PHPz
PHPzOriginal
2016-05-16 19:20:211141browse

I saw someone posted a page in the group asking if opacity does not support IE6. Is there any good support method? The first time I posted it, I noticed that the jq library was used, and I immediately thought of supporting it. But many people answered using CSS filters, when I saw this answer. Some were surprised. Doesn’t everyone know that JQ supports opacity and is compatible with IE6? At first they didn't believe it. How to use JQ together. So I wrote a simple code for them.

The code is as follows: 

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs
/jquery/1.4.0/jquery.min.js"></script>
<style type="text/css">
.aa,.bb{width:200px; height:200px; margin:10px; background-color:#000}
.bb{background-color:#F00; opacity:0.5}
</style>
<script type="text/javascript">
    $(function(){
        $(".aa").css("opacity",0.1)    
    })
</script>
</head>
<body>
<p class="aa"></p>
<h2>JQ版</h2>
<p class="bb"></p>
<h2>CSS版</h2>
</body>
</html>

If you copy and run the above code. You will find out. The first block is transparent under IE6.

I don’t know the principle either. It should be that JQuery itself has already considered this compatibility. It's just that no one noticed it. Just here to give you a reminder.

PS: IETester version IE6 viewing on some computers is not transparent. This should be an IETester problem. Testing found no systematic differences.

For more related tutorials, please visit JavaScript Video Tutorial

Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：showModalDialog and showModelessDialog_javascript tricksNext article：showModalDialog and showModelessDialog_javascript tricks

Related articles

See more