解决opacity属性在低版本IE浏览器下失效的方法

解决opacity属性在低版本IE浏览器下失效的方法以前,一直都以为ie9以下的版本不支持opacity属性。所以就同时使用opacity和ie独特的filter蒙版。但是有些时候需要一些动态的效果,就比如层的渐渐消失,隐藏,就需要使用动态变化的opacity,这种情况下,同时使用opacity和filter就显的有点麻烦了。其实,只使用opacity+jquery就完全解决这个问题。用法如下:<scripttype…

大家好,又见面了,我是你们的朋友全栈君。

以前,一直都以为ie9以下的版本不支持opacity属性。所以就同时使用 opacity和ie独特的filter蒙版。但是有些时候需要一些动态的效果,就比如层的渐渐消失,隐藏,就需要使用动态变化的opacity,这种情况下,同时使用opacity和filter就显的有点麻烦了。
其实,只使用opacity+jquery就完全解决这个问题。

用法如下:

<script type="text/javascript">
    $(function () { $("#p1").css("opacity", 0.6); });
</script>

由于博客里面不能写js代码,有兴趣的朋友们可以把下面示例代码直接拷贝到txt文件中,
然后把文件后缀名改为.html就好,然后直接运行这个文件就可以在浏览器中看效果了。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script src="http://ajax.proxy.ustclug.org/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<title>CSS opacity 属性示例</title>             
<style type="text/css" media="all">
#p2{
    
    opacity:0.4;}
p{
    
    width:200px;height:200px;background-color:green;float:left;}
</style>
<script type="text/javascript">
    $(function () { $("#p1").css("opacity", 0.6); });
</script>
</head>
<body>
<p id="p1">opacity:0.6;这个透明度通过jquery添加,不存在低版本IE浏览器不兼容的现象</p>
<p id="p2">opacity:0.4;这个透明度直接使用样式设置,低版本的IE浏览器会没有透明效果</p>
</body>
</html>

 

转载于:https://www.cnblogs.com/xyyt/p/3979265.html

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/146168.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 使用Instsrv.exe和Srvany.exe 安装windows服务「建议收藏」

    使用Instsrv.exe和Srvany.exe 安装windows服务「建议收藏」要把应用程序添加为服务,你需要两个小软件:Instsrv.exe和Srvany.exe。Instsrv.exe可以给系统安装和删除服务,Srvany.exe可以让程序以服务的方式运行。这两个软件都包含在WindowsNTResourceKit里,如果你没有,也可以到网上下载。1.下载instsrv.exe和srvany.exe我下载的地址[点击打开链接][https:…

    2022年6月8日
    29
  • 用C++实现五子棋人机对战小游戏

    用C++实现五子棋人机对战小游戏如何用C++实现五子棋小游戏呢?五子棋可谓是家喻户晓了,在科技如此发达的今天,我们能不能用电脑实现五子棋人机对弈呢?答案当然是可以的首先,思考一下我们需要完成哪些步骤1、打印棋盘(使用二维数组即可)2、判断胜负(可以考虑深搜,但是暴力似乎能让代码更简洁)3、思考下一部棋该怎么走先从最简单的一部开始:打印棋盘voidout(){for(inti=0;i<=24;i++){for(intj=0;j<=24;j++){if(

    2022年6月16日
    60
  • java 将String字符串转 List集合「建议收藏」

    java 将String字符串转 List集合「建议收藏」StringgameString=”199,99,243,34,52,57,193,277,194,284,275,270,274,54,238,259,225,262,32,53,31,196,33,286,246,285,94,200,276,269,242,271,40,272,278,251,5,288,11,283,245,253,58,241,282,197,237,93,55,

    2022年5月14日
    50
  • 三菱PLC学习方法分享

    三菱PLC学习方法分享  学习plc不是为了研究,而是为了工作需要和应用。下面是我学习PLC的方法,供大家参考!  与PLC自动化相关的知识点很多,比如PLC控制、模拟控制、定位、通信、配置、嵌入式系统、变频器、机械传动、液压系统(不知道是不是自动化)等。知识点太多。以常见的PLC为例,三菱、西门子、欧姆龙、松下、LG、达美、卡恩斯等品牌,加上各种国产品牌和众多知识点。如何学好它们?我理解的学习方法是“巧学”。  以我熟悉的三菱plc为例:  一、基础:一定要打好基础——基础是什么?  1.安装编程软件。  

    2022年10月9日
    0
  • haproxy小结(一)基础概念篇

    haproxy小结(一)基础概念篇

    2022年3月7日
    36
  • Python怎么输入小数和整数_python输入非负整数

    Python怎么输入小数和整数_python输入非负整数python匹配整数或者小数(包括正数和负数)(简单易懂,代码可以直接运行)*这个实验算是五个正则表达式里面最难的的哪一个了,?是正则表达式里面贪婪与非贪婪的概念,有?则-?可有可无,刚好可以用于判断正数和负数,.在正则表达式里面表示的是任意字符(空格除外),因此如果要想表示小数点,需要加上以恶搞转义字符\,而区分整数和小数这两种情况,则需要加上一个|符号,表示前面的字符出现0次一次,+表示前面的字符出现1次以上#匹配整数或者小数num=’3333.3333’sss=re.search(r

    2022年9月1日
    0

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号