H5实现跳动的音乐谱

1、页面代码：

<div class="sound-bar">    <div class="bar-1"></div>    <div class="bar-2"></div>    <div class="bar-3"></div>    <div class="bar-4"></div></div>

2、css

.sound-bar{    position: absolute;    cursor: pointer;    padding: 20px;}.sound-bar div{    position: absolute;    bottom: 0;    width: 3px;    height: 4px;    background: #b57f60;;}.bar-1{    right: 11px;}.bar-2{    right: 16px;}.bar-3{    right: 21px;}.bar-4{    right: 26px;}
3、jquery，由于它的跳动是不固定的，所以我们要用到随机函数
var Bar1=setInterval(bar1,200);var Bar2=setInterval(bar2,200);var Bar3=setInterval(bar3,200);var Bar4=setInterval(bar4,200);function bar1(){    $(".bar-1").css({        "height":parseInt(Math.random()*20+1)+'px'    });}function bar2(){    $(".bar-2").css({        "height":parseInt(Math.random()*20+1)+'px'    });}function bar3(){    $(".bar-3").css({        "height":parseInt(Math.random()*20+1)+'px'    });}function bar4(){    $(".bar-4").css({        "height":parseInt(Math.random()*20+1)+'px'    });}