2

我的 nivoslider 插件在所有浏览器上都可以正常工作,直到 ie8/9 - 但是在 IE 7 中,滑块工作正常,但我看不到指示滑块中有多少图像的正方形(nivocontrol nav)。我已经尝试过 position:absolute 和 z-index,但我似乎无法让它工作。在它拒绝工作之前,所以我将它从 window.load 更改为 document.ready 并解决了 50% 的问题。

该网站是http://www.sarahlayton.co.uk,如果您在 IE8/9 中查看它,您会看到图像滑块下方的方块,然后 ie7 将其隐藏。我有点困惑我哪里出错了?

有人可以指导我吗?真的会很感激

<script type="text/javascript">
$(document).ready(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
       });
    });
</script>
4

2 回答 2

3

此修复对我有用(仅在 IE7 中的 css 内)

.nivo-controlNav a {
    text-indent: 0;
    font-size: 0;
    line-height: 0;
}

text-indent: 0;将获得正确的位置,font-size: 0;需要隐藏数字,line-height: 0;如果 font-size 为 0,则需要隐藏 IE7 上出现的点

于 2012-08-03T13:44:25.143 回答
0

我相信我有同样的问题。滑块效果很好,但控制导航链接不会在 IE7 中显示。我还不知道为什么,经过 4 个小时的工作,我不确定我不再关心了。但这对我有用:

  1. 寻找“文本缩进:-9999px;” 对于 CSS 中的“.nivo-controlNav a”类 - 将其注释掉。
  2. 编辑 jquery.nivo.slider.js - 第 165 行并取出 a 标签中的 HTML,基本上使它看起来像:

    vars.controlNavEl.append('<a class="nivo-control" rel="'+ i +'"></a>');
    

这对我有用,到目前为止我找不到任何问题。希望它可以帮助你。

于 2012-07-08T18:49:59.447 回答