评论

button有效区域问题

页面加了buton实现分享功能,但是出现一个问题,点击页面大部分区域竟然都调起了分享

为什么使用小程序的分享功能,所以使用了button按钮

然后发现有边框,解决这个问题的过程中,不小心修改了button的postion属性,然后就出现了一个问题:

点击页面大部分区域都会调起分享功能,非常的坑

PS:去掉边框,加button::after{
border: none;
}这个就可以了

最后一次编辑于  08-20  
点赞 0
收藏
评论

2 个评论

  • 仙森ღ₅₂₀¹³¹⁴
    仙森ღ₅₂₀¹³¹⁴
    08-20

    app.wxss里加下

    button {
       background-color: transparent;
       padding: 0;
       margin: 0;
       position: static;
       border: 0;
       border-radius: 0;
    }
    button::after {
      content: '';
      -webkit-transform:scale(1);
      transform:scale(1);
      display: none;
      background: transparent;
    }


    08-20
    赞同
    回复 3
    • 剑齿留痕
      剑齿留痕
      08-22
      我之前是不小心给button加了个position:instail ,这个属性还是少动为妙
      08-22
      回复
    • 仙森ღ₅₂₀¹³¹⁴
      仙森ღ₅₂₀¹³¹⁴
      08-22回复剑齿留痕
      en
      08-22
      回复
    • valuelan
      valuelan
      08-26回复剑齿留痕
      button after 和before 默认是有position: absolute; 你把父级改了还说人家坑
      08-26
      回复
  • 小打卡
    小打卡
    08-20

    通过调试工具看下button实际区域,如果此问题排除的话,看看是不是有冒泡的可能

    08-20
    赞同
    回复 1
    • 剑齿留痕
      剑齿留痕
      08-22
      实际区域没问题来着,之前无意给button加了一个,postion:instial,把这个去掉就可以了
      08-22
      回复