IE6 显示问题（鼠标移动到小图片上，显示设定好的大图片）

实现效果：鼠标移动到<a>上，显示一个高260px 宽200px的<span> ,<span>用到了背景图片 WX_lele.png

             鼠标移出<a>,该<span>隐藏

所遇问题：其他浏览器运行完好，唯独IE6 <span>内容只显示（隐藏）一次 ，鼠标再次移入移出没有反应，且<a>标签 鼠标移上去 鼠标指针没有变成“手”

 

Html 设计代码：

<div class="leo" style="background: url('image/ico_apps.gif') no-repeat 0px -125px;
                        width: 20px; height: 20px; float: right; margin-top: 3px;">
    <a href="#"><span class="prompt"></span></a>
</div>

CSS 代码：

.leo a:hover .prompt
{
    display: block;
    position: absolute;
    width: 200px; /*span 宽度*/
    top: 20px; /*相对于a标签的位置控制*/
    left: 0px; /*透明度0.9  opacity: 0.9; filter: alpha(opacity=90);*/
    height: 266px; /* span 高度*/
    border: 1px solid #FF0000;
    background: url(../../image/WX_lele.png);
    z-index: 9999; /*此span在所有div之上显示*/
}

.leo a
{
    display: block;
    width: 20px;
    height: 20px;
    text-align: center;
    text-decoration: none;
    position: relative;
    top: 0px;
    left: 0px;
    z-index:999;
}

 

解决方案办法：

在CSS 文档中，加入如下代码。

a:hover{border:none;} /*解决IE下只显示一次的问题*/
.test:hover{cursor:pointer;}