Question

我在我的网站上安装了Nivo Slider 3.2的最新版本，它在Firefox和Chrome中运行良好，但在IE8中，幻灯片链接不起作用。我搜索并尝试了一堆解决方案，例如添加到我的CSS：

.nivoSlider a, .nivoSlider img {
    display: block !important;
}

但这仅适用于滑块的第一张图像，其余图像不会链接到指定的页面。

我的网站为here，点击“卡车销售”上方

CSS是here

感谢您的帮助！

Answer 1

这是nivo滑块的已知问题，添加以下css：

.nivoSlider a.nivo-imageLink{
    display:none;
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-opacity:0;
    -moz-opacity:0;
    -khtml-opacity:0;
    opacity: 0;
    background-color:#fff;
}

.nivoSlider a.nivo-imageLink img{
    display:block!important;
}

之所以发生这种情况是因为IE在没有背景的情况下渲染空<a>时出现问题。很久以前，我曾想过在flash元素上放置一个链接。给它一个背景并将不透明度设置为0将使其正常工作而不会损害设计。

Answer 2

这对我不起作用，但我找到了另一种解决方案：

.nivoSlider a.nivo-imageLink {
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    border:0;
    padding:0;
    margin:0;
    z-index:6;
    display:none;
    background:white;
    filter: alpha(opacity=0);
    /other than IE/
    -moz-opacity:0;
    -khtml-opacity:0;
    opacity: 0;
    line-height: 375px; /*Change this to the height of your image*/
    font-size: 0px;
}

.nivoSlider a.nivo-imageLink img{
    display:block!important;
}

现在在每个图片链接前添加一些文字：

<a href="yourlink.php">TEXT GOES HERE<img src="yourimage.jpg" alt="image" /></a>

这有点hacky，但它确实有效。 -Cheers

Nivo Slider链接在IE8中不起作用

2 个答案: