在 IE6 中使用 jquery 不会改变背景图像

Question

我的页面上有一个没有默认背景图像 css 的面板。在加载时，它使用 jquery 设置为初始图像，等待 10 秒，然后从一些预定图像中加载随机图像。有上一个和下一个按钮，可让您循环浏览图像。在 ie6 中，加载初始图像，然后在 10 秒后加载随机图像，但是按 prev/next 会导致背景变为白色并且图像未加载。通过警报，我发现它仍在跟踪它应该加载的图像的位置和 url，但不会加载它。这是下面的代码。

<script type="text/javascript">
    var facts = new Array();
    var position;
    $(document).ready(function() {
        <xsl:for-each select="$currentPage/ancestor-or-self::node[@level=1]/../node[@nodeName='Fun Fact Folder']/node">
            facts[<xsl:value-of select="position()" />] = '<xsl:value-of select="." />';
        </xsl:for-each>
        if(window.location.pathname == "/homepage.aspx" || window.location.pathname == "/") {
            $(".fun_facts_bg").css("background-image", "url(images/fun_fact_homepage.JPG)");
            setTimeout("randomFact()",10000);   
        } else {
            randomFact();
        }
    });
    function randomFact() {
        $("a.previous_button").css("display", "block");
        $("a.next_button").css("display", "block");
        position = Math.ceil(Math.random() * (facts.length - 1));
        changeFact(0);
    }
    function changeFact(increment) {
        position = checkPosition(position, increment);
        $(".fun_facts_bg").css("background-image", "url(" + facts[position] + ")");
    }
    <xsl:text disable-output-escaping="yes">&lt;!--//--&gt;&lt;![CDATA[//&gt;&lt;!--
    function checkPosition(currentPos, increment) {
        currentPos = currentPos + increment;
        if (currentPos &gt; facts.length - 1) {
            currentPos = 1;
        } else if (currentPos &lt; 1) {
            currentPos = facts.length - 1;
        }
        return currentPos;
    }
    //--&gt;&lt;!]]&gt;</xsl:text>
</script>

<a class="previous_button" href="javascript:void(0);" onclick="changeFact(-1);">
<a class="next_button" href="javascript:void(0);" onclick="changeFact(1);">

Answer 1

我很确定您应该在某处使用模数以确保您保持在预期范围内。这可能会有所帮助。