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%的透明度输出：
仅从代码来看是没问题的。但影响程序运行的因素是多方面的，没看到你完整的代码（包括js和html），不好妄下定论，仅仅猜测一下：你说运行到调整透明度的语句就不再往下运行了，那么原因估计是两个：一是left和right这两个id在页面上不存在（或者存在一个以上）；二是浏览器不支持opacity。你可以在出错的地方测试一下：console.log(document.getElementById("left"))
console.log(document.getElementById("left").style.opacity)
只要看哪个显示的是undefined，就知道是哪个出问题了。
其实你按F12打开开发者界面，看一下红字提示应该就知道什么原因了啊？不会用吗？
//淡入效果(含淡入到指定透明度)function fadeIn(elem, speed, opacity){
/*
* 参数说明
* elem==>需要淡入的元素
* speed==>淡入速度,正整数(可选)
* opacity==>淡入到指定的透明度,0~100(可选)
*/
speed = speed || 20
opacity = opacity || 100
//显示元素,并将元素值为0透明度(不可见)
elem.style.display = 'block'
iBase.SetOpacity(elem, 0)
//初始化透明度变化值为0
var val = 0
//循环将透明值以5递增,即淡入效果
(function(){
iBase.SetOpacity(elem, val)
val += 5
if (val <= opacity) {
setTimeout(arguments.callee, speed)
}
})()
}
//淡出效果(含淡出到指定透明度)
function fadeOut(elem, speed, opacity){
/*
* 参数说明
* elem==>需要淡入的元素
* speed==>淡入速度,正整数(可选)
* opacity==>淡入到指定的透明度,0~100(可选)
*/
speed = speed || 20
opacity = opacity || 0
//初始化透明度变化值为0
var val = 100
//循环将透明值以5递减,即淡出效果
(function(){
iBase.SetOpacity(elem, val)
val -= 5
if (val >= opacity) {
setTimeout(arguments.callee, speed)
}else if (val < 0) {
//元素透明度为0后隐藏元素
elem.style.display = 'none'
}
})()
}
var btns = document.getElementById('demo')
btns.onclick = function(){
fadeIn(btns)
}
btns.onclick = function(){
fadeOut(btns,40)
}
<p id="demo" style="width:300pxheight:300pxbackground:#f00">淡入淡出</p>
试试吧
