zoukankan      html  css  js  c++  java
  • 小刘同学的第二十九篇博文

    很遗憾今天没有干货分享出来,不过明天就考试了,衷心希望SQL Server数据库可以过啊!!!

    白天状态都不怎么好,也不知道是快考试了还是怎么,反正都不是很好。

    下午自己找了很多鸡汤读,还打印出来了,希望能对自己有点帮助吧。

    发现跟录播真是会漏掉很多知识点啊,上次那个小球随机移动的,老师给了一段很风骚的代码,大家可以看看。

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
        <style>
            html,body{
                 100%;
                height: 100%;
                margin: 0;
                padding: 0;
            }
            #box{
                 50px;
                height: 50px;
                background-color: #abcdef;
                border-radius: 50%;
                position: fixed;
                left: 1px;
                top: 1px;
                cursor: pointer;
            }
        </style>
    </head>
    <body>
        <div id="box"></div>
        <script>
            var maxWidth = document.body.offsetWidth-50;
            var maxHeight = document.body.offsetHeight-50;
            function randomMove(){
                var box = document.getElementById("box");
                var left = parseInt(box.style.left)||0;
                var top = parseInt(box.style.top)||0;
    
                var nleft = (Math.ceil(Math.random()*1000)%maxWidth);
                var ntop = (Math.ceil(Math.random()*1000)%maxHeight);
                var leftInterval = setInterval(function(){
                    if(left<nleft){
                        box.style.left = (++left)+"px";
                    }else if(left>nleft){
                        box.style.left = (--left)+"px";
                    }else{
                        clearInterval(leftInterval);
                        clearInterval(topInterval);
                        randomMove();
                    }
                },10);
                var topInterval = setInterval(function(){
                    if(top<ntop){
                        box.style.top = (++top)+"px";
                    }else if(top>ntop){
                        box.style.top = (--top)+"px";
                    }else{
                        clearInterval(topInterval);
                        clearInterval(leftInterval);
                        randomMove();
                    }
                },10);
            }
            randomMove();
            // setInterval(randomMove,1000);
        </script>
    </body>
    </html>

    这个缓慢移动的动画效果的确很厉害,不过没录播上没有细讲,现在也只能根据代码来理解了。

    这个|| 0 有点意思,要是我应该会写更复杂的逻辑。

    还用到了递归,有点复杂,分析一下又觉得还好,明天自己再实现一下吧。还是要多敲才行,自己不敲,完全看老师敲没啥软用。。。╮(╯▽╰)╭

  • 相关阅读:
    CS224n, lec 10, NMT & Seq2Seq Attn
    CS231n笔记 Lecture 11, Detection and Segmentation
    CS231n笔记 Lecture 10, Recurrent Neural Networks
    CS231n笔记 Lecture 9, CNN Architectures
    CS231n笔记 Lecture 8, Deep Learning Software
    CS231n笔记 Lecture 7, Training Neural Networks, Part 2
    pytorch坑点排雷
    Sorry, Ubuntu 17.10 has experienced an internal error
    VSCode配置python插件
    tmux配置与使用
  • 原文地址:https://www.cnblogs.com/xiaoliutongxue/p/8326024.html
Copyright © 2011-2022 走看看