zoukankan      html  css  js  c++  java
  • 背景大图隔几秒切换(非轮播,淡入淡出)--变形金刚joy007 项目总结

    工作日想了好久,周日回家才想出来的。。。

     

    图片切换(非轮播,淡入淡出)

    1.切换2.停止

    <html>
    <head>
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
    <style type="text/css">
    div{ position: absolute; left: 0px; top: 0px;}
    .div1{  800px; height: 400px; background-color: #ff3366;display: none}
    .div2{  800px; height: 400px; background-color: #33ff66;}
    
    a{ position: absolute; right: 0px;}
    </style>
    <script type="text/javascript" src="scripts/jquery-1.8.1.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
    });
    var c = setTimeout("show1()",1000);
    
    
    function show1(){
        console.log(Math.random());
        $(".div1").fadeIn(1000);
        $(".div2").fadeOut(1000);
        c = setTimeout("show2()",2000)
    }
    
    function show2(){
        console.log("may i " + Math.random());
        $(".div1").fadeOut(1000);
        $(".div2").fadeIn(1000);
        c = setTimeout("show1()",1000)
    }
    
    function clearTimer(){
        alert("clearTimer");
        clearTimeout(c)
    }
    
    </script>
    </head>
    
    <body>
    
        
    
        <div class="div1"></div>
        <div class="div2"></div>
    
        <a href="#" onclick="clearTimer()">aaaaa</a>
    
    </body>
    
    </html>
  • 相关阅读:
    待你长发及腰
    《线段树》讲稿
    Codeforces #Round 376 F 题解
    包裹快递 题解
    Codeforces #Round 376 部分题解
    圆圈舞蹈 题解
    奶牛晒衣服 题解
    BZOJ 1034 题解
    BZOJ 1045 题解
    BZOJ 1054 题解
  • 原文地址:https://www.cnblogs.com/della/p/3776353.html
Copyright © 2011-2022 走看看