手机端页面,点击img的图片,会变成预览模式 5C

H5页面中几乎所有图片都是img,然后用定位做的。
貌似小的图片不会有这样的情况,比较大的图片,像大于300以上的图片,点击后会变成预览模式。。
这会造成用户体验比较差,应该不会出现这种情况才对,有谁知道是为什么吗?

4个回答

原来只要是手机端的img就肯定会有这个情况。
解决了,坐我旁边的大神,给了我这个,img{ pointer-events: none; }

img{ pointer-events: none; }

给你思路
点击时给图片添加一个class,例如active,
每次点击判断是否该dom含有active,class,
如果有就移除class,
如果没有添加这个class,
而你的css,用这个class渲染图片放大并居中等等你想要的效果,
可以加上transition起到平滑动画的效果

在img元素上添加 onclick="return false"

2、.图片用背景图的方式插入
background:url(a.png) norepeat center;
3、.使用js事件阻止默认行为的方法,这里需要注意哦!
var img = document.getElementById('banner');

img.addEventListener('click',function(e){

  e.preventDefault();

});

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问