以前つくった イエローカード にさらに改良を加え、画面をタップした際にホイッスルっぽい音を出すことにしてみました。
ソース
HTML
<style> html, body { margin: 0; padding: 0; height: 100%; } #card { width: 100%; height: 100%; background: -webkit-gradient(linear, left top, left bottom, from(#ffee61), color-stop(0.2, #f4dd1b), to(#f4dd1b)); } </style> <body> <div id="card"></div> <script> var audio = new Audio("whistle.mp3"); document.querySelector("title").innerText = "Yellow"; document.querySelector("#card").addEventListener("click", function() { audio.load(); audio.play(); }, false); </script> </body>
マニフェストファイル
CACHE MANIFEST # 2013-06-29:0.0.3 CACHE: index.html appicon.png favicon.ico whistle.mp3