SOURCE

var danmu=document.getElementById('danmu');
        var winH=danmu.clientHeight;
        var speak=['哇塞好牛逼啊','好帅啊','前方高能','hahahahaha','哈哈哈哈','风流倜傥','我爱你阿啊啊啊','哈哈哈'];
        function insert(){
            var newli=document.createElement('div');
            var randomS=Math.floor(Math.random()*8);
            var r=Math.floor(Math.random()*266);
            var g=Math.floor(Math.random()*266);
            var b=Math.floor(Math.random()*266);
            newli.innerHTML=speak[randomS];
            newli.className='newli';
            newli.style.color='rgb('+r+','+g+','+b+')';
            var t=winH-50;
            var newliT=Math.floor(Math.random()*(t-1));
            var newliL=danmu.clientWidth;
            newli.style.left=newliL+'px';
            newli.style.top=newliT+'px';
            danmu.appendChild(newli);
            move(newli);
        }
        function move(obj){
            var timer1=setInterval(function(){
                // var danmu=document.getElementById('danmu');
                var newliW=obj.clientWidth;
                var run=obj.offsetLeft;
                run--;
                if (run<=-newliW) {
                    danmu.removeChild(obj);
                    clearInterval(timer1);
                }
                obj.style.left=run+'px';
            },1)
         }
         // insert();
         var timer2=setInterval(function(){
             insert();
         },1000);
        window.onfocus=function (){
            clearInterval(timer2);
            timer2=setInterval(function(){
                insert();
            },1000);
      }
      window.onblur=function (){
            clearInterval(timer2);
        }

<div id="danmu"></div>

*{margin: 0;padding: 0;list-style: none;}    
    html,body{width: 100%;height: 100%;}
    body{background-color: #000;font-family: '微软雅黑';}
    #danmu{position: relative;height: 100%;width: 100%;overflow: hidden;font-size: 50px;}
    #danmu .newli{background-color: #fff;height: 50px;line-height: 50px;position: absolute;overflow: hidden;}