作品一覧に戻る
的を当てろ

的を当てろ

秋山宗太郎 04/03 15:13
アプリを動かす
コードを見る
<p id="score">0点</p>
<div id="target">🎯</div>
body {
  margin: 0;
  min-height: 100vh;
  overflow: hidden;
}

#score {
  font-size: 1.5rem;
  padding: 10px;
}

#target {
  position: fixed;
  font-size: 100px;
  cursor: pointer;
  user-select: none;
}
const target = document.querySelector('#target');
const score  = document.querySelector('#score');
let count = 0;

target.style.left = Math.random() * (window.innerWidth  - 120) + 'px';
target.style.top  = Math.random() * (window.innerHeight - 120) + 'px';

target.addEventListener('click', function() {
  count = count + 1;
  score.textContent = count + '点';

  target.style.left = Math.random() * (window.innerWidth  - 120) + 'px';
  target.style.top  = Math.random() * (window.innerHeight - 80) + 'px';
});