0

I have a simple website which has a few :hover effects in it, placed on div's, not links. I need to make these effects visible on the ipad.

I am currently using 'touchstart' in my header:

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

Which does a good job... On the ipad, when i touch the div, the mouse over (hover) effect is displayed. When i touch anywhere outside of the div, the effect is reversed (mouse out).

However, i need the effect to reverse even if i tap on the same div again...

Anyone able to help? Thanks! M

Miro
  • 131
  • 2
  • 19
  • Just make an if statement in your touchstart function, and ceck wheter the element that was clicked has already been tapped. If so, remove the hover effect, otherwise add it. – Michael Kunst Jul 17 '13 at 15:48
  • Surely theres a better way using touchend... – Miro Jul 17 '13 at 16:27
  • As I'm interpreting this you cant use touchend in this case, as you want to unhighlight the div if you tap it again, not if you leave it with your finger. Correct me if I got this wrong. – Michael Kunst Jul 18 '13 at 07:45
  • Michael, that is correct... i want to unhighlight it if i tap it again... What i understand is that the function 'click' translates to touchstart + touchend... now when you click a button on a website, it has the 'active' element which displays... you let go of the click, it returns to normal, before it takes you to where it needs to go... does this not translate to touchstart and touchend? – Miro Jul 18 '13 at 08:53

0 Answers0