Question

我正在将Cycle.js用于项目。我创建了一个静态导航区域并使用分页器：在循环中允许用户单击要查看的幻灯片。在所有主流浏览器，FF，Safari，Chrome，IE9等中，一切看起来都很好。但是在IE 7和8中，它并没有像预期的那样褪色。它闪烁为白色，然后下一张幻灯片闪烁进入视图。对于为什么会这样，我感到很困惑。

如果我完全删除了分页并输入了3000的例子，那么它会很好地消失。寻呼机有问题吗？我基本上只是直接从Cycle.js项目站点示例中使用它（除了修改下面评论的索引值），看到here。

jQuery(function($){
        $('.Slides').cycle({ 
            fx:     'fade', 
            timeout: 0,
            pager:  '#nav',
            pagerAnchorBuilder: function(idx,slide){
                idx -= 1 // we don't want the first slide so reduce the index # by 1
                return '#nav div:eq(' + idx + ') ';
            } 
        });

HTML看起来很简单，就像这样：

        <div id="nav">
            <div id="stage_1"></div>
            <div id="stage_2"></div>
            <div id="stage_3"></div>
        </div>

这个标记很快就会改变，但是现在看不出这与手头的问题有什么关系。

有什么想法吗？感谢。

Answer 1

我弄清楚我的错误是什么。包含幻灯片的HTML包含一个容器和另外两个元素img和a。非常简单的东西：

<div class="slide">
  <img src="path_to_my_img" />
  <a href="path_to_another_page">Link Text</a>
</div>

过渡只是引起了眨眼，下一张幻灯片会出现在仅显示白色的时刻之后。没有转换可行（淡入淡出，转向等）。为了解决这个问题，我只需要在容器div中添加一个背景颜色，这是我在IE条件下做的。对我来说，这可以解决，因为img与div的大小相同，并且锚是绝对定位的。

Cycle.js IE7 / 8点击寻呼机使其闪烁，不褪色

1 个答案: