how to deal with hover effect on touch devices

Answer 1

Try this:

<script>
document.addEventListener("touchstart", function(){}, true);
</script>

Answer 2

Several solutions:

• skip hover effects in touch device stylesheets
• use JavaScript to turn hover into click interactions
• use JavaScript to simulate hover interactions on the touch device (see this Question on StackOverflow