internet-explorer - Nivo Slider 缩略图在 IE 中无法正确显示

Question

创建一个新站点，但在 IE 中发生了一些事情。我已经为 wordpress 插件购买了 Nivo Slider，它运行良好，但是它没有在 IE 的横幅下显示缩略图。

这就是它在 Firefox 中的样子在此处输入图像描述

这就是它在 IE 中的样子在此处输入图像描述

因为这是一个插件（并且网站在 2 天后没有给我任何支持）我真的没有源 CSS，但我希望你可以用开发人员工具来看看它，看看为什么它可能没有显示在 IE 中？

这是我发现的

.theme-default .nivo-controlNav.nivo-thumbs-enabled img {
    display: block;
    height: auto;
    width: auto;
}

任何帮助或建议表示赞赏。

更新

在此处输入图像描述

输入新代码后，.banner-bottom 将显示在所有其他页面的横幅顶部。

score 6 · Accepted Answer

添加这个 CSS（演示）：

#ie6 .nivo-controlNav a, #ie7 .nivo-controlNav a {
    position: relative;
    text-indent: 0;
}

如果您不能/不想以 IE 为目标，那么这也可以使用（演示）：

body .nivo-controlNav a.nivo-control {
    position: relative;
    text-indent: 0;
}

score 1 · Accepted Answer

Ambrelasweb，您的网站使用的是Nivo Slider v3.0.1，我准备了一个可在IE7中运行的 jsFiddle，因为缩略图不会显示在该浏览器中。我还为那些使用旧版 Nivo Slider v2.7.1 的人添加了一个额外的 jsFiddle。

最小的 CSS：.theme-default.controlnav-thumbs .nivo-controlNav a {text-indent:0px;}

您的特定网页有一个单独的类名称问题，一旦您应用上面显示的最小 Nivo Slider CSS.banner-bottom，它实际上会“覆盖”缩略图。要在IE7中快速查看缩略图，只需暂时注释掉包含类。span tag.banner-bottom

score 0 · Accepted Answer

尝试使用以下方法查看是否出现拇指：

.theme-default .nivo-controlNav.nivo-thumbs-enabled img {
    display: block;
    height: auto;
    width: auto;
    /width:100%;
    /height:100%;
}

那应该只更改 IE 的高度和宽度属性。如果确实显示，您可能需要指定宽度和高度。

3 回答 3