JQuery----別踩白塊簡易版

最新推荐文章于 2018-10-17 14:35:48 发布

laizhixue

最新推荐文章于 2018-10-17 14:35:48 发布

阅读量252

点赞数 1

分类专栏： JQuery

本文链接：https://blog.csdn.net/laizhixue/article/details/79170912

版权

JQuery 专栏收录该内容

27 篇文章 0 订阅

订阅专栏

@{
    ViewBag.Title = "LoginSuccess";
}

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8">
    <style>
        #center div {
            float: left;
            border: 1px solid;
        }
    </style>
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
    </script>
    <script>
        function test() {
            alert("test");
        };

        $(function () { 
        var adiv = document.getElementById("center");
        var btn = document.getElementById("btn");
        var color = ['while', 'black'];
        var mc = document.getElementById("mc");
        var score_div = $("#score_div");
        var score_int = 0;
        var forTime_int = 0;
        var divs;
        btn.onclick = function ()
        {
            setInterval(function (){
                for (var i = 0; i < 9; i++){
                    $("#mc").append("<div style='display:block;width:100px;height:120px;background:" + color[Math.floor(Math.random() * 10 % 2)] + ";'></div>");  
                }
                divs = adiv.getElementsByTagName("div");
                //if (forTime_int >= 6) {
                //    $(divs[3]).next().remove();
                //}
                for (var i = 0; i < divs.length; i++)
                {
                    divs[i].ind = i;
                    divs[i].onmouseover = function () {
                        if (divs[this.ind].style.background == "black")
                        {
                            score_int++;
                            $(this).unbind();
                            this.style.background = "red";
                            score_div.html("分數：" + score_int);

                        }
                    }
                }
             
                forTime_int++;

            }, 500);

        };
        });
    </script>
</head>

<body>
    <button id="btn">添加div</button>
    <div id="score_div">分數</div>
    <br><br>
    <div id="center" style="height:400px;width:300px;border:1px solid #F22;">
        <marquee behavior=alternate scrollamount=18 height=400 width=320 direction=down id="mc"></marquee>
    </div>
</body>
</html>

laizhixue

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
JQuery----別踩白塊簡易版

@{ ViewBag.Title = "LoginSuccess";} #center div { float: left; border: 1px solid; } function test() {
复制链接

扫一扫