On some mobile browsers, if you click on the image, you will browse the image.
QQ does not have this default behavior, but UC browsers do.
Therefore, in order to achieve consistent results, this default browsing behavior needs to be prohibited.
Here are a few methods:
1. Add onclick="return false" on the img element
<img src="" onclick="return false" />
2. The picture is inserted in the background image
background:url() norepeat center;
3. How to use js events to block default behavior, you need to pay attention to it here!
var img = ('banner');
('click',function(e){
();
});
Regarding the click event here, it can actually be a touchend event, but it can't be a touchstart or touchmove event!
Because when using touchstart and touchmove events, if there is a super large banner image at the top of the page, then when the screen width is greater than the height such as iPad, the entire banner image fills the screen, and the page cannot slide at this time. Because you use touchstart and touchmove to block the default behavior of dropping the picture, the page does not respond to no matter how your fingers slide. Just so this sliding behavior triggers touchstart and touchmove.
4. Implemented through CSS3 attributes
img {
pointer-events: none;
}
This setting will cause the img tag point; the event is invalid. If you need to click to retain the event, you need to add the parent element to handle the click event.
The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.