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

时间:2010-04-27 23:05:02

标签: javascript jquery internet-explorer-6 background-image

我的页面上有一个没有默认background-image 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);">

1 个答案:

答案 0 :(得分:0)

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