头闻号

广州三湘源精细化工有限公司

皮肤用化学品|毛发用化学品|丰胸化学品|瘦身化学品|芳香除臭化学品|其他日用化学品

首页 > 新闻中心 > 科技常识:阻止h5手机点击图片会有查看大图的功能
科技常识:阻止h5手机点击图片会有查看大图的功能
发布时间:2024-11-15 20:36:35        浏览次数:5        返回列表

今天小编跟大家讲解下有关阻止h5手机点击图片会有查看大图的功能 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关阻止h5手机点击图片会有查看大图的功能 的相关资料,希望小伙伴们看了有所帮助。

问题现象:

在H5页面,多次点击img标签时,会弹出当前的图片(效果类似查看),再点击,恢复。只是部分手机点击图片会出现只看该图的功能,这个是手机自己浏览器自带的功能,这个时候只要将图片的冒泡冒泡阻止掉就可以了,或者使用css样式属性pointer-events也可以解决。

解决:

1 css设置

img{ pointer-events: none; }

这种方式可以解决这个问题,但是当如果你在此时的img上绑定点击事件,点击图片时这个事件将不会被触发。这种情况可以使用一个带点击事件的元素包裹这个img解决。

2 js阻止浏览器默认行为

imgEles.addEventListener('click',function(e){  e.preventDefault();});

3.将图片显示改为背景图显示

来源:爱蒂网