App封面广告 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>ES6</title>
    <meta name="viewport" content="width=device-width,initial-scale=1.0,
    minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <script src="js/jquery.js"></script>
    <style>
        #cover{
            position: fixed;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            z-index: 998;
            background-color:#3278b3;
        }
        #skip{
            width: 80px;
            position: absolute;
            top: 20px;
            right: 20px;
            color: #fff;
            font-size: larger;
            font-weight: 800;
            border: 1px solid #fff;
            border-radius: 4px;
            padding: 5px;
        }
        #sec{
            padding: 4px 9px;
            background-color: #fff;
            border-radius: 50%;
            width: 16px;
            height: 16px;
            color:#000;
        }
    </style>
</head>
<body>
<div id="cover">
    <div id="skip">
        <span><span id="sec">5</span>S跳过</span>
    </div>
</div>
<div id="container">
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
    <p>container message...</p>
</div>
</body>
<script>
    var num=5;
    var aa=setInterval(function(){
        $("#sec")[0].innerHTML=num;
        num--;
        if(parseInt($("#sec")[0].innerHTML)==0){
            $("#cover").remove();
            clearInterval(aa)
        }
    },1000);
    $("#cover").click(function(){
        $("#cover").remove();
        clearInterval(aa)
    })
</script>
</html>

 

posted on 2017-02-20 15:08  carlyin  阅读(289)  评论(0)    收藏  举报

导航