webkitAudioContext实现浏览器中模拟钢琴弹奏声音的代码

代码语言:html

所属分类:多媒体

代码描述:webkitAudioContext实现浏览器中模拟钢琴弹奏声音的代码

代码标签: webkitAudioContext 浏览器 模拟 钢琴 弹奏 声音 代码

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Piano</title>
  <style>
    .piano-key {
      display: inline-block;
      width: 50px;
      height: 200px;
      border: 1px solid #000;
      cursor: pointer;
    }
  </style>
</head>
<body>

<script>
  window.onload = function () {
    var audioContext = new (window.AudioContext || window.webkitAudioContext)();
    
    function playSound(frequency) {
      var oscillator = audioContext.createOscillator();
      oscillator.type = 'sine';
      oscillator.frequency.setValueAtTime(frequency, audioContext.currentTime);
      
      var gainNode = audioContext.createGain();
      gainNode.gain.setValueAtTime(0.5, audioContext.currentTime);
      gainNode.gain.exponentialRampToValueAtTime(0.01, audioContext.currentTime + 1.0);
      
      oscillator.connect(gainNode);
      gainNode.connect(audioContext.destination);
      
      oscillator.start();
      oscillator.stop(audioContext.currentTime + 1.0);
    }
  .........完整代码请登录后点击上方下载按钮下载查看

网友评论0