如何禁用峰值和弹出效果（iPhone 6s上的Safari具有强压力效果）

Question

I need to disable peak effect (strong pressure's effect with Safari on iPhone 6s) on "a" element in this code (bootstrap environment):

 <article> <div class="gall-thumbnail"> <a data-toggle="modal" href="mod1#"> <img src="img.jpg"/> <p class="text-center caption">Caption</p> </a> </div> <div class="modal fade" id="mod1"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> <h5 class="modal-title text-center">Caption</h5> </div> <div class="modal-body"> <img src="img.jpg" class="img-responsive"/> </div> </div> </div> </div> </article> 

I need to disable it because if strong pressing with Safari on iPhone 6s then bootstrap's "modal" component is here in conflict with "peak", and it shows picture other than enlarged img.jpg.

So it would be nice to disable "peek" on "a" element or to show enlarged img.jpg when strong pressing with Safari on iPhone 6s.

Answer 1

If you would like to disable peeking when you "strong" press an element on iOS you can set the webkit-user-select and the webkit-touch-callout property to none in css. If you are trying to prevent it on all "a" tags you could do something like this:

a{
  -webkit-user-select:none;
  -webkit-touch-callout: none;
}