Question

我正在使用IE6的迟来的PNG修复程序：

http://www.dillerdesign.com/experiment/DD_belatedPNG/

像这样：

<!--[if lt IE 7]>
    <script type="text/JavaScript" src="/Scripts/DD_belatedPNG_0.0.8a-min.js" defer="defer"></script>
    <script type="text/JavaScript" src="/Scripts/DD_PNG_listing.js" defer="defer"></script>
<![endif]-->

我有一个HTML标签列表：

        <ul class="tabs">
            <li class="comparison"><a href="/"><span>Comparisons</span></a></li>
            <li class="scenario"><a href="/"><span>Scenarios</span></a></li>
            <li class="analysis"><a href="/"><span>Analysis</span></a></li>
        </ul>

和CSS：

#icis_dashboard .w_price_history .tabs 
{
    position:absolute;
    bottom:19px;
    right:5px;
    }

#icis_dashboard .w_price_history .tabs li
{
    height:98px;
    margin:0;        
    width:41px;
    }    

#icis_dashboard .w_price_history .tabs li a,
#icis_dashboard .w_price_history .tabs li a span 
{
    background:url("../images/icons/sprite_tabs.png") no-repeat 0px 0px;
    cursor:pointer;
    display:block;
    height:100%;
    text-indent:-99999px;    
    width:100%;    
    } 

#icis_dashboard .w_price_history .tabs li a:hover
{
    background-position: -51px 0px;   
    }

#icis_dashboard .w_price_history .tabs li.comparison a span
{
    background-position: 0px -110px;}        

#icis_dashboard .w_price_history .tabs li.comparison a:hover span 
{
    background-position:-50px -110px;    
    }

#icis_dashboard .w_price_history .tabs li.scenario a span 
{
    background-position: 0px -205px;}

#icis_dashboard .w_price_history .tabs li.scenario a:hover span
{
    background-position: -50px -205px;}

#icis_dashboard .w_price_history .tabs li.analysis a span
{
    background-position: 0px -285px;}    

#icis_dashboard .w_price_history .tabs li.analysis a:hover span
{
    background-position: -50px -285px;}

但是，在父锚点悬停时，跨度不会改变IE6中的背景位置。

Answer 1

从脚本（0.0.8）：

if (el.nodeName == 'A') {
    moreForAs = {mouseleave: 'handlePseudoHover', ...

即。它仅支持:hover对a元素的影响，而不支持其中的元素（a:hover span）。

您也许可以尝试黑客攻击该行以检查您想要的其他元素，例如

var tag= el.nodeName.toLowerCase();
if (tag==='a' || tag==='span') {
    ...

Answer 2

尝试在span元素中添加填充。

24位PNG：悬停不调整锚点上的背景位置IE6

2 个答案: