jqueryhtmlcssjquery-click-event

jQuery click event not working for SVG element on mobile devices

I am using an SVG as a map, which when you click on certain pointers should show you more information. When clicking the Ellipse for Aston Villa Football Club on desktop the correct information box is opened, and the name is logged to the console. This does not work at all on mobile decides.

$(".marker") is on a a <g> element.

http://map.digitronix.studio/

The SVG map is loaded in through PHP using:

<?php echo file_get_contents("map4.svg"); ?>

Any help would be great! thanks.

Solution

  • Use tap and touchstart:

    $(".your-element").on('click tap touchstart', function() {
   // Do something
});