Css 在Chrome/Firefox中使用Nivo滑块强制背景色-IE工作正常

我已经花了相当多的时间调查这个问题，但没有发现任何有用的东西，所以我在这里发布这个问题，希望有人能够提供帮助

我有这个问题已经有一段时间了，但最终还是找到了一些时间来尝试解决这个问题。几年前，我创建了基于SharePoint的公司内部网，它是为IE设计的公司浏览器。在过去的几个月里，用于各种进程的其他浏览器有所增加，尤其是Chrome

IE（9&11）中主门户上的Nivo滑块按预期工作。图像按设计进行显示和旋转

我的问题是在Chrome和Firefox中，滑块根本不显示图像

编辑：CSS

#滑块{位置：相对；背景：#202834；}

中的此部分强制在图像上使用背景色。我试着从滑块css中注释出bg颜色，但这并没有解决问题，它显示的是白色背景/编辑

图像仍在滑块内旋转，只是图像本身没有出现，示例如下：

我在CSS中使用了一些选项，并将

窗口更改为
文档。已准备好
，但没有效果。我肯定知道这是CSS中的一种设置，但很难找出哪种设置是罪魁祸首

我在下面附上了一份脚本副本，该脚本几乎未涉及在线源代码：

<script type="text/javascript">
 $(window).load(function() {

 $('#slider').nivoSlider({
    effect: 'random', // Specify sets like: 'fold,fade,sliceDown'
    slices: 15, // For slice animations
    boxCols: 8, // For box animations
    boxRows: 4, // For box animations
    animSpeed: 300, // Slide transition speed
    pauseTime: 6000, // How long each slide will show
    startSlide: 0, // Set starting Slide (0 index)
    directionNav: false, // Next & Prev navigation
    directionNavHide: false, // Only show on hover
    controlNav: true, // 1,2,3... navigation
    controlNavThumbs: false, // Use thumbnails for Control Nav
    controlNavThumbsFromRel: false, // Use image rel for thumbs
    controlNavThumbsSearch: '.jpg', // Replace this with...
    controlNavThumbsReplace: '_thumb.jpg', // ...this in thumb Image src
    keyboardNav: true, // Use left & right arrows
    pauseOnHover: true, // Stop animation while hovering
    manualAdvance: false, // Force manual transitions
    captionOpacity: 0.0, // Universal caption opacity
    prevText: 'Prev', // Prev directionNav text
    nextText: 'Next', // Next directionNav text
    beforeChange: function() { }, // Triggers before a slide transition
    afterChange: function() { }, // Triggers after a slide transition
    slideshowEnd: function() { }, // Triggers after all slides have been shown
    lastSlide: function() { }, // Triggers when last slide is shown
    afterLoad: function() { } // Triggers when slider has loaded
   });
});

我用Firefox运行了firebug，并在下面展示了结果。它没有生成任何控制台错误，但它突出显示了NivoSlider div中的某些区域：


我注意到的最后一件事是，在IE开发者工具中，文档模式被设置为IE8标准，这很好。如果我将文档模式更改为IE9，那么它将在IE中复制相同的问题

是否有人可以从提供的信息中确定为什么Chrome和Firefox会出现这种情况？
在Google Chrome中检查元素
，并确保该图像中应用了任何背景颜色。。。。或者最好发布一个提琴
嗨，背景图像的颜色来自css，这一行更重要的是，#滑块{位置：相对；背景：#202834；}。如前所述，在IE中，图像在滑块中显示良好，但在Chrome和Firefox中，此CSS显示背景图像。我试着注释掉背景颜色，但现在它所做的只是显示一个白色背景。这是一个基于SharePoint的页面，试图通过摆弄所有相关内容类型和母版页引用来发布HTML不会有多大帮助。css中是否有任何突出的地方可以解释为什么它会在滑块中的图像链接上强制使用背景色？
/* Home Slider */
#slideshow {height:303px; /*background: url('../../../Images/ss_back.png') no-repeat center; margin: 0 0 10px 0;*/}
#slider {position:relative; background:#202834; }
#slider a {border:0; display:block; }
#slider img {position:absolute; top: 0; left: 0; display:none;}
.nivoSlider {position:relative; top:15px; left:16px; width:100%;}
.nivoSlider img {position: absolute; top:0px; left:0px;}
.nivoSlider a.nivo-imageLink {position:absolute; top:0px; left:0px; width:100%; height:100%; border:0; padding:0; margin:0; z-index:60; display:none;}
.nivo-slice {display:block;position:absolute;z-index:50;height:100%;}
.nivo-caption {position:absolute; left:0; bottom:-55px; color:#666; font-size:14pt; width:100%; z-index:89;}
.nivo-caption p {padding:0;margin:0;}
.nivo-prevNav {left:5px;}
.nivo-nextNav {right:5px;}
.nivo-controlNav {position:absolute; right:30px; bottom:-55px;}
.nivo-controlNav a {display:block; width:31px; height:23px; background:url('../../../Images/bullets.png') no-repeat; text-indent:-9999px; border:0; float:left; position:relative; z-index:99; cursor:pointer;}
.nivo-controlNav a.active {background-position: -31px 0; font-weight:bold;}
.nivo-directionNav a {display:block; width:50px; height:50px; text-indent:-9999px; border:0; position:absolute; top:45%; z-index:99; cursor:pointer;}
a.nivo-nextNav {background: url('../../../Images/next.png'); right:40px;}
a.nivo-prevNav {background: url('../../../Images/prev.png'); left:10px;}