Question

我有一个我正在开发的网站，主页上有多个Div。我在页面右侧有一个标记为right_bar2的div，我希望它每5-10秒更改一次。整个div只是一个链接的图像。基本上我认为最简单的方法就是拥有一个带有一堆隐藏div的div然后可能是一些javascript一次取消隐藏一个div然后再次隐藏它并取消隐藏另一个div。但是我不确定最好的方法。我看了一堆例子，无法让它100％正确地工作。

感谢您的任何建议;）

JsFiddle的例子很棒！

我尝试了类似这样的http://jsfiddle.net/VENLh/4/，但在我的rails环境/设置中，它打破了多个东西，所以我想要更清洁，更容易的东西。

Answer 1

我在this fiddle中清理了一下，但如果您说原始版本在原始环境中打破了多个内容，则可能无法修复它们。具体是什么打破了？

我清理的是为了避免为JS保留DIV的手动计数或担心他们的ID。代码非常简单：

$(function() {
    var $divs = $('div', '#container'),
        total = $divs.length,
        counter = 0,

        showDiv = function() {
            $divs.stop().hide();
            $($divs[counter]).show('fast');
            counter = (conter + 1) % total;
            setTimeout(showDiv, 3000);
        };
    $divs.hide();
    showDiv();
});

我没有执行应该完成的一项优化。您可能应该在每个DIV上缓存jQuery选择器的结果。使用jQuery map语句会很容易，但我不想在这里混淆水域。

Answer 2

在这种情况下我唯一能看到的问题是如果你要使用沉重的图像，可能需要一些时间才能加载。当您第一次显示图像时，图像将开始加载。所以对于这个我会说你应该保持不透明度为0并在页面加载时加载图像。

并且还可以消除您在使用不透明度删除一个div隐藏且其他可见的延迟。将1的不透明度从100降低到0％，将其他的不透明度从0降低到100％。

更改Div的内容以循环通过AD或内容或随便

2 个答案: