Tap and Tap Hold Action not working in Mobile Phone / Firefox Mobile Tester

I am trying to change the opacity of an element on mousetap or hold in shopify but it doesn’t seem to work. I have added prevent default as the grid-product__link is a link <a href="url" class="grid-product__link is a link">

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>    
<script>      
  $(document).ready(function() {        
  $('grid-product__link').on('taphold',function(event){
    event.preventDefault;
     $('.grid-product__secondary-image').css('opacity','1');
    });
    
   $('grid-product__link').on('tap',function(event){
    event.preventDefault;
      $('.grid-product__secondary-image').css('opacity','1');
    });   
  });      
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-mobile/1.4.1/jquery.mobile.min.js"></script>

Answer

event.preventDefault is a function. And you just referenced it as a value instead of running it in your code.

Instead of,

event.preventDefault;

you should do this:

event.preventDefault();

Advertisement

Answer