JSFiddle - React, Tailwind, and code Playground

by MegaScience

HTML

<div id="MenuBar">
  <ul>
    <li style="background-color:#F37700;"><a href=" http://www.fnaflore.com">Timeline</a>
      <img src="http://www.fnaflore.com/wp-content/uploads/2016/01/FreddyMenubar.png" width="256" height="40" usemap="#honk" onclick="window.audio.play();" />
      <map name="honk">
        <area shape="rect" coords="126,25,132,31" alt="Honk" onclick="playSound();">
      </map>
      <audio id="audio" src="http://fnaflore.com/wp-content/uploads/2016/01/XSCREAM2.wav" preload="auto"/>
    </li>
  </ul>
</div>
<script type="text/javascript">
  var lastAudio;

  function playSound(soundfile) {
    if (lastAudio !== null) {
      lastAudio.stop();
      console.log("How?");
    }
    lastAudio = new Audio(soundfile || "http://fnaflore.com/wp-content/uploads/2016/01/XSCREAM2.wav");
    lastAudio.play();
  }

</script>