Jquery脚本在IE7上无法正常工作

我有一个楼层平面的脚本，它可以在鼠标悬停时更改各个公寓的图像，使它们显示不同的颜色。它适用于除IE7之外的所有浏览器。在IE7上，当鼠标悬停在上面时，图像会发生变化，但不是正确的图像，而是另一层的图像。我不是自己写脚本的，我只是负责调试它，不知道它的哪些部分在IE7中不能正常工作。任何帮助都将不胜感激

以下是脚本：

$(document).ready(function() {

    // add links to sidebar
    $('#secondary-nav').append('<li id="f2" class="floor">Floor 2</li>');
    $('#secondary-nav').append('<li id="f3" class="floor">Floor 3</li>');
    $('#secondary-nav').append('<li id="f4" class="floor">Floor 4</li>');
    $('#secondary-nav').append('<li id="f5" class="floor">Floor 5</li>');
    $('#secondary-nav').append('<li id="f6" class="floor">Floor 6</li>');
    $('#secondary-nav').append('<li id="f7" class="floor">Floor 7</li>');

    // display floor
    $('#secondary-nav li').click(function(){
        var floor = $(this).attr('id').replace('f','');
        $('#frame').fadeOut(200);
        $('#secondary-nav li').removeClass('current');
        setTimeout(function() {
            $('#floors li#f'+floor).addClass('current');
            $('.units').css('display','none');
            $('#frame').css('background-image','url(floorplans/img/selectors/floorplates-bg/'+floor+'.png)');
            $('#frame').fadeIn(200);
            $('#floor'+floor).fadeIn(200);
        }, 500);
    });

    // highlight on mouseover
    $(".units div").hover(function(){$('img',this).stop().animate({opacity:0},200);}, 
                          function(){$('img',this).stop().animate({opacity:1},200);});

    // display floorplan
    $('.units div').each(function(i){
        var floor = $(this).parent().attr('id').replace('floor','');
        var unit = floor + $(this).attr('class').replace('u','');
        var details = $('a',this).attr('title');
        var group = $('a',this).attr('class').replace('i','');
        $(this).click(function(){
            $('#details .info h1').html('Unit '+unit);
            $('#details .info h2').html(details);
            $('#details .info a').attr('href','floorplans/downloads/'+group+'.pdf');
            $('#details .floorplate img').attr('src','floorplans/img/floorplans/floorplates/Unit-'+unit+'.png');
            $('#details .floorplan img').attr('src','floorplans/img/floorplans/'+group+'.png');
        });
        $(this).fancybox({'href':'#details'});
    });

});

$（文档）.ready（函数（）{
//向侧边栏添加链接
$（'secondary nav'）。追加（'li id=“f2”class=“floor”>floor 2）；
$（'secondary nav'）。追加（'li id=“f3”class=“floor”>floor 3）；
$（'secondary nav'）。追加（'li id=“f4”class=“floor”>floor 4）；
$（'secondary nav'）。追加（'li id=“f5”class=“floor”>floor 5）；
$（'secondary nav'）。追加（'li id=“f6”class=“floor”>floor 6）；
$（'secondary nav'）。追加（'li id=“f7”class=“floor”>floor 7）；
//展台
$（#辅助导航li'）。单击（函数（）{
变量下限=$（this.attr（'id'）。替换（'f'，''）；
$（“#帧”）。淡出（200）；
$（#辅助导航li'）.removeClass（'current'）；
setTimeout（函数（）{
$（'#floors li#f'+floor）.addClass（'current'）；
$（'.units'）.css（'display'，'none'）；
$（'#frame'）.css（'background-image'，'url（floorplans/img/selectors/floorplates bg/'+floor+'.png）'）；
$（'框架'）.fadeIn（200）；
美元("楼层"加楼层).法代因(200),；
}, 500);
});
//鼠标上方突出显示
$（“.units div”）.hover（函数（）{$（'img'，this）.stop（）.animate（{opacity:0}，200）；}，
函数（{$（'img'，this）.stop（）.animate（{opacity:1}，200）；}）；
//显示平面图
$（'.units div'）。每个（函数（i）{
var floor=$（this.parent（）.attr（'id'）.replace（'floor'，''）；
var单位=地板+$（本）.attr（'class'）。替换（'u'，''）；
var details=$（'a'，this.attr（'title'）；
变量组=$（'a'，this）.attr（'class'）.replace（'i'，''）；
$（此）。单击（函数（）{
$（'#details.info h1'）.html（'单位'+单位）；
$（'#details.info h2'）.html（details）；
$（'#details.info a'）.attr（'href'，'floorplan/downloads/'+group+'.pdf'）；
$（'details.floorplate img'）.attr（'src'，'floorplans/img/floorplans/floorplates/Unit-'+Unit+'.png'）；
$（'details.floorplan img'）.attr（'src'，'floorplan/img/floorplan/'+group+'.png'）；
});
$（this.fancybox（{'href'：'#details'}）；
});
});

您知道，您可以重复使用一些选择器，对吗？每次使用.append？都可以附加多个html节点。我看到的唯一一个引起兼容性问题的标志是不透明度的使用。要使不透明性在旧版本的IE中发挥作用，css中必须有几个方面。例如，元素必须具有布局。将其位置设置为相对、应用缩放或显示：内联块都是实现这一点的方法。哦，是的，谢谢Kevin B！我没有写脚本，所以我只是想解决我需要的一件事，并没有真正尝试优化脚本。既然您提到我将更改该部分。这是我正在处理的页面：