zoukankan      html  css  js  c++  java
  • 微信公众号网页开发——阻止微信客户端内点击任何图片自动放大

    在开发微信公众号时遇到一个问题,在微信客户端内点击公众号网页任何图片都会自动全屏放大预览,这个问题导致原本点击的是某个功能,结果却没有跳转或实现功能,而是把功能DIV元素块的背景图给放大预览了

    解决方法:在公共样式文件内加入以下CSS代码移除img标签的可点击事件属性,加上后所有作用于img标签的onclick事件将无效

    img{
      pointer-events:none;  
    }

    现在这个问题解决了,但是还有一个新问题来了,需要点击放大预览的图片现在点击没有任何反应了,准确的说应该是所有带有图片的元素的点击事件都失效了,比如背景图是覆盖满元素的

    解决方法:在公共样式文件内加入以下CSS代码让拥有该类名的元素可点击事件生效,在需要点击放大预览的图片上加上该类名后即可正常触发onclick事件

    .img{
       pointer-events:auto;
     }

    jQuery weui 预览图片

    $('.img').click(
         function () {
              var This = $(this);
              var img = $.photoBrowser({
                    items: [
                        This.attr('src')
                    ]
              });
              img.open();  //打开
         }
    
     );

    知识普及:CSS Demo: pointer-events

  • 相关阅读:
    LeetCode--Insert Interval
    LeetCode--Surrounded Regions
    LeetCode--Container With Most Water
    LeetCode--Permutation Sequence
    NYOJ---540奇怪的排序
    NYOJ-858下三角矩阵
    素数筛选法
    NYOJ----776删除元素
    矩阵快速幂
    神奇算式
  • 原文地址:https://www.cnblogs.com/shengxihui/p/10960700.html
Copyright © 2011-2022 走看看