touchclick

by Nic Fontaine

HTML

<h4>Click or tap body to trigger event</h4>
<ul>
  <li>'click' event on document</li>
  <li>'touchstart' event to handle touchscreen</li>
</ul>

CSS

html {
  background: teal;
  font-family: sans-serif;
  color: #fff;
}

html.tog {
  background: purple;
}

body {
  background: transparent;
}

JavaScript

document.addEventListener('touchstart', function(e) {
	e.stopPropagation()
  e.preventDefault()
  ev()
}, {passive:false})

document.addEventListener('click', function(e) {
	ev()
})

function ev() {
	document.getElementsByTagName('html')[0].classList.toggle('tog')
}