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

의도 한 범위 내에서 머물 수 있도록 모듈을 사용해야합니다. 그게 도움이 될거야.