图片切换代码，滤镜透明部分在IE6下渐变失效,求原因！

我用的不是png做背景，用#box .span样式单独定义了一个块。#box .span {display:block;width:100%;height:60px;position:absolute;bottom:0;right:0;opacity:0.4;filter:alpha(opacity=40);background:#000;}

渐变效果：

//图片切换, 淡入淡出效果
function show (a)
{
index = a;
var alpha = 0;
for (i = 0; i < aNum.length; i++)aNum[i].className = "";
aNum[index].className = "current";
clearInterval(timer);

for (i = 0; i < aImg.length; i++)
{

aImg[i].style.opacity = 0;
aImg[i].style.filter = "alpha(opacity=0)";
aImg[i].style.zIndex=999;

}
aImg[index].style.zIndex=1000;
timer = setInterval(function () {
alpha += 2;
alpha > 100 && (alpha =100);
aImg[index].style.opacity = alpha / 100;
aImg[index].style.filter = "alpha(opacity = "+ alpha + ")";

alpha == 100 && clearInterval(timer)
},20);
}
};
</script>;


在主体中引用部分

div class="middlftop1">
<div id="box">

<ul class="list"> #set ($as = $bbstopicCategory.getArticleList(161,"",3))
#foreach ($article in $as)
<li><a href="$!article.relink" title="$!article.subject" target="_blank"><img src="$cgi.BaseURL/upload/$!article.image" width="180" height="180" border="0" ></a>
<span class="span"></span>
<span class="counttt">$util.summarize($!article.subject,12)</span>
</li><br> #end </ul>
<ul class="count">
<li class="current">1</li>
<li>2</li>
<li>3</li>
</ul>
</div>


原理，先把背景块定位，<span class="span"></span>

然后标题块放在背景块的上面。<span class="counttt">$util.summarize($!article.subject,12)</span>

定义标题块的代码：#box .counttt{display:block; width:100%;height:50px;position:absolute;bottom:0;right:0;color:#fff;padding-left:16px;font-size:12px;font-family: Verdana;text-decoration:none;}