加载图片、倒计时--Columbia项目总结

时间：2021-10-26 19:32:24

CSS3 居然会在隐藏显示的时候触发，真心太神奇了(在ff下是没有用的，在chrome下才阔以)

貌似我还是写了大循环，怎么样才能优化这个循环呢

加载图片：已经用到过好多次了↓

function loadImg(url){

        var img = new Image(); //创建一个Image对象，实现图片的预下载

        img.src = "images/"+url;

        if(img.complete) { // 如果图片已经存在于浏览器缓存，直接调用回调函数

            $("div").append(_img);

            return; // 直接返回，不用再处理onload事件

        }

        img.onload = function () {

            $("div").append(_img);

        }

    }

首页添加 定时添加css，为了防止setInterval可能不会停止，在unload和点击的时候都clearInterval了 ↓

var t = null , c = null;

    function timedMsg()

    {

        t=setInterval('$(".btn_begin").addClass("shake")',5000);

        c=setInterval('$(".btn_begin").removeClass("shake")',3000);

    }

    function clearTime(){

        clearInterval(t);

        clearInterval(c);

    }

    window.onload = function(){

        $(".btn_begin").click(function(){

            clearTime();

        });

        timedMsg();

    }

    window.unload = function(){

        clearTime();

    }

倒计时：

 20140612 新增（老项目中别人用的，感觉比我自己写的简单多了）↓

var count=15;

var timter=setInterval(function(){

    count--;

    if(count<=0){

        clearInterval(timter)

        window.location.reload();

    }else{

        $(".erro-panel span").show();

    }

},1000);
<html>

<head>

<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">

<script type="text/javascript">

var c=0,t;

function timedCount()

{

    document.getElementById('txt').value=c

    c=c+1

    if( c >= 8){

        stopCount()

    }else{

        t=setTimeout("timedCount()",1000)

    }

}

function stopCount()

{

    clearTimeout(t)

}

</script>

</head>

<body>

<form>

<input type="button" value="开始计时！" onClick="timedCount()">

<input type="text" id="txt">

<input type="button" value="停止计时！" onClick="stopCount()">

</form>

<p>

请点击上面的“开始计时”按钮。输入框会从 0 开始一直进行计时。点击“停止计时”可停止计时。

</p>

</body>

</html>

相关文章