html52.com
我爱小程序-开发者交流社区

clip-path:polygon 真机不显示,模拟器正常,加了-webkit前缀也没用

框架类型 问题类型 终端类型 微信版本 基础库版本
小程序 Bug 微信安卓客户端 7.0.15 Android 8.0.0, WechatLib: 2.3.0
class="scan">view>


@keyframes move {
  to {
    background-position: 0 100%, 0 0, 0 0, 0 0;
    /* 终止位置 */
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
    -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
  }
}
.scan {
  width: 100;
  height: 300px;
  clip-path: polygon(0% 0%, 100% 0%, 100% 1.5%, 0% 1.5%);
  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 1.5%, 0% 1.5%);
  background-image: linear-gradient(#1a98ca, #1a98ca),
          linear-gradient(90deg, #ffffff33 1px, transparent 0, transparent 19px),
          linear-gradient(#ffffff33 1px, transparent 0, transparent 19px),
          linear-gradient(transparent, #1a98ca);
  background-image: -webkit-linear-gradient(#1a98ca, #1a98ca),
          -webkit-linear-gradient(90deg, #ffffff33 1px, transparent 0, transparent 19px),
          -webkit-linear-gradient(#ffffff33 1px, transparent 0, transparent 19px),
          -webkit-linear-gradient(transparent, #1a98ca);
  animation: move 2s infinite linear;
  -webkit-animation: move 2s infinite linear;
}


代码在模拟器和web上是有效的,真机上不行了,类似于一个扫描效果

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

真正的个人免签约支付接口

云免签H5支付