js将十六进制颜色转透明度的函数
CSS颜色的表示方式一般有两种10进制与16进制,分别是【rgb(255, 100, 0)】【#FF0000】。两个16进制组合数是0-255(16*16=256)。
颜色是RGB红绿蓝三原色组成的,16进制的颜色由6位字符组成(如:FF0000,相隔重复类型也可以简写成F00),如果16进制要包含透明度必须由八位字符组成(如:FFDDAA80)。
平时css样式的透明度都是按十进制计算的,如:opacity: 0.5与background-color: rgba(255, 100, 0, 0.8)。
10进制的255阶为不透明(0%),0阶为100%透明。所以如果要获取50%透明度,255 * 0.5 = 127.5将127.5四舍五入再转16进制,方法如下:
下面方法是0%-100%的透明度输出:
这样:
<script language="javascript">
function hide(id)
{
if(document.getElementById(id).filters.alpha.opacity >= 0)
{
document.getElementById(id).filters.alpha.opacity -= 5
window.setTimeout("hide(\"" + id +"\")", 100)
}
}
</script>
扩展资料:注意事项
此外对于透明度有一点要说明一下,就是在IE中在css中设置透明度的方式filter:alpha(opacity:value)其中value值从0~100
透明度可以通过opacity:value来设置,其中value=0~1.
代码如下:
<!DOCTYPE html>
<html>
<head>
<title>js动画事件</title>
<link href="move.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="move.js"></script>
</head>
<body>
<div id="div1">
</div>
</body>
</html>
仅从代码来看是没问题的。但影响程序运行的因素是多方面的,没看到你完整的代码(包括js和html),不好妄下定论,仅仅猜测一下:你说运行到调整透明度的语句就不再往下运行了,那么原因估计是两个:一是left和right这两个id在页面上不存在(或者存在一个以上);二是浏览器不支持opacity。你可以在出错的地方测试一下:console.log(document.getElementById("left"))
console.log(document.getElementById("left").style.opacity)
只要看哪个显示的是undefined,就知道是哪个出问题了。
其实你按F12打开开发者界面,看一下红字提示应该就知道什么原因了啊?不会用吗?