一つのケースを共有します.電子オルガンの製作です.

    
    
    
    
    
    
        window.onload=function (ev) {

          var datas={
              49:{
                  div:0,audio:400+400*(1/8)
              },
               50:{
                  div:1,audio:400+400*(2/8)
              },
               51:{
                  div:2,audio:400+400*(3/8)
              },
              52:{
                  div:3,audio:400+400*(4/8)
              },
              53:{
                  div:4,audio:400+400*(5/8)
              },
              54:{
                  div:5,audio:400+400*(6/8)
              },
              55:{
                  div:6,audio:400+400*(7/8)
              },
              56:{
                  div:7,audio:400+400*(8/8)
              }
          }

          var keys=document.querySelectorAll(".box div")

           var audio=new AudioContext();
           var os
           var flag=true;
          document.onkeydown=function (ev2) {
              if(!flag){
                  return
              }
              flag=false
              var key=ev2.keyCode
              os=audio.createOscillator()
              var aa=audio.createAnalyser()
              var gain=audio.createGain()

              os.connect(aa)
              os.connect(gain)
              os.connect(audio.destination)
              os.frequency.setValueAtTime(datas[key]["audio"],audio.currentTime)
              os.start(audio.currentTime)
              keys[datas[key]["div"]].style.boxShadow="0 0 10px #000 inset"
          }

          document.onkeyup=function (ev2) {
              flag=true;
              var key=ev2.keyCode

              os.stop(audio.currentTime)
              keys[datas[key]["div"]].style.boxShadow="none"
          }
        }

    


  

      
1
      
2
      
3
      
4
      
5
      
6
      
7
      
8