Question

我想开发一个网页，我需要每隔60秒更换一次css，每30秒后更换一次图像。

但是在从一个CSS到另一个css的过渡期间，下载css和图像需要花费很多时间，过渡也不是很顺利。

那么，有什么方法可以下载所有的css和图像，我需要进行转换，当页面第一次加载时？

我正在使用以下代码来更改css：

<script type="text/javascript">
            var interval

            $(document).ready(function() {
            interval = setInterval("tog()", 60000);
            });
</script>

function tog()


{

if (currentStyle == "css/style_purple.css") 
  {

         $("#stylesheet").attr({href : "css/style_green.css"});

        currentStyle = "css/style_green.css";

   } 

else 

if (currentStyle == "css/style_green.css") 
 {

    currentStyle = $("#stylesheet").attr({href : "css/style_orange.css"});

     currentStyle = "css/style_orange.css";

   } 

else if (currentStyle == "css/style_orange.css") 
{

    currentStyle = $("#stylesheet").attr({href : "css/style_red.css"});

    currentStyle = "css/style_red.css";

}
else if (currentStyle == "css/style_purple.css") 
{  

   currentStyle = $("#stylesheet").attr({href : "css/style_red.css"});

   currentStyle = "css/style_red.css";

} 

else

{

   currentStyle =  $("#stylesheet").attr({href : "css/style_purple.css"});

    currentStyle = "css/style_purple.css";

}

}

Answer 1

为什么不更改对象的属性（即class）并将样式应用于类。

<script src="jquery.js"></script>
<script>
var flag = 1;

$(function (){
  setInterval('change()', 2000);
})

function change(){  
    if(flag%2 == 1)
    {       
        $('.one').attr('class', 'two');
        $('.1').attr('class', '2');
    }
    else
    {
        $('.two').attr('class', 'one');
        $('.2').attr('class', '1');        
    }
    flag++;
}
</script>
<html>
    <div class="one"></div>
    <div class="1"></div>
</html>

从一个CSS过渡到另一个

1 个答案: