supber

导航

css闪动效果 ----样式发生快速的变化 

<!DOCTYPE >
<html>
    <head>
        <title>JS+CSS做文字闪烁</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <style>
            .wa{
                font-size:13px;  
                color: #0000FF;  
            }
            .wa2{
                font-size:13px;  
                color: #FFFF00; 
            }
            .sty1{
                display: block;    
            }
            .sty2{
                display: none;    
            }
         </style>
    </head>
    <body>
         <span class="wa" id="shan">北京青年</span>
         <div class="sty1" id="pic">
             <img src="../img/girl.jpg" />
         </div>
         <script type="text/javascript">
             function change(){
                 var ss = document.getElementById("shan");
                 if(ss.className == "wa"){
                     ss.className = "wa2";
                 }else{
                     ss.className = "wa";
                 }
                 setTimeout("change()",100);
             }
             change();
             picChange();
             function picChange(){
                 var pic = document.getElementById("pic");
                 if(pic.className == "sty1"){
                     pic.className = "sty2";
                 }else {
                     pic.className = "sty1";
                 }
                 setTimeout("picChange()",50);
             }
         </script>
    </body>
</html>

 

posted on 2014-04-30 15:25  supber  阅读(922)  评论(0)    收藏  举报