以下修改,亲测有效
非弹窗内动画写法

.submit_btn{

   animation: submit_btn 1.5s infinite;

    -webkit-animation: submit_btn 1.5s infinite;

}

@keyframes submit_btn {
    0%,
    20%,
    80%,
    100% {
      transform: scale(1);
    }
    40%,
    50% {
      transform: scale(0.9);
    }
  }

弹窗内写法:在className后增加  :local
:global {
  .submit_btn :local {
    animation: submit_btn 2.5s ease-out;
  }
  @keyframes submit_btn {
    0%,
    20%,
    80%,
    100% {
      transform: scale(1);
    }
    40%,
    50% {
      transform: scale(0.9);
    }
  }
}

  

react module.scss文件中弹窗中 keyframes动画不生效,的更多相关文章

  1. css中animation和@keyframes 动画

    Animation 使用简写属性,将动画与 div 元素绑定: div { animation:mymove 5s infinite; -webkit-animation:mymove 5s infi ...

  2. 【已解决】React中配置Sass引入.scss文件无效

    React中配置Sass引入.scss文件无效 在react中使用sass时,引入.scss文件失效 尝试很多方法没法解决,最终找到解决方法,希望能帮助正在坑里挣扎的筒子~ 在node_modules ...

  3. React中配置Sass引入.scss文件无效

    React中配置Sass引入.scss文件无效 在react中使用sass时,引入.scss文件失效尝试很多方法没法解决,最终找到解决方法,希望能帮助正在坑里挣扎的筒子~ 在node_modules文 ...

  4. 踩坑,vue项目中,main.js引入scss文件时报错

    当我们在src目录下创建.scss文件,并在main.js中引用,运行时会报: ERROR Failed to compile with 1 errors 5:25:07 PMThis relativ ...

  5. 【微信】微信小程序 微信开发工具中新创建的json文件,编译报错VM1781:2 pages/module/module.json 文件解析错误 SyntaxError: Unexpected end of JSON input

    如果新创建报错:编译报错VM1781:2 pages/module/module.json 文件解析错误  SyntaxError: Unexpected end of JSON input 解决方法 ...

  6. 原生小程序中实现将scss文件实时编译为wxss文件

    参考链接 全局安装gulp,方便以后直接执行gulp命令 npm install gulp -g 用原生小程序新建一个项目 在小程序根目录(app.js同级目录)中新建package.json文件 n ...

  7. React 与 Redux 在生产环境中的实践总结

    React 与 Redux 在生产环境中的实践总结 前段时间使用 React 与 Redux 重构了我们360netlab 的 开放数据平台.现将其中一些技术实践经验总结如下: Universal 渲 ...

  8. Ionic中弹窗

    Ionic中弹窗有两种ionicModal和ionicPopup; $ionicModal是完整的页面: $ionicPopup是(Dialog)对话框样式的,直接用JavaScript设定对话框的一 ...

  9. JQ方法实用案例///鼠标移动到div和修改ipt中弹窗、CSS鼠标变小手、JQ获取元素属性、JQ选择器

    今天学习了jQ,jQ对js的帮助很大,菜鸟教程上也有属性.可以查看 js 和 jquery主要的区别 在 dom    想用jquery  必须先引入(顺序问题)        先css 再js:   ...

  10. Python “No module named” 以及在Python2中可以导入,但在python3中却出现的原因

    Python “No module named” 以及在Python2中可以导入,但在python3中却出现的原因 原因之1: 例如有这样的一个包和它的模块: Test __init__.py Mod ...

随机推荐

  1. git修改远程分支

    git remote -v 查看远程仓库 git remote rm origin 删除远程分支 git remote add git remote add origin git@codeup.ali ...

  2. windows下搭建stm8s开发环境

    拓扑:windows -> st_link_v2 ->目标板,目标板不由st_link_v2供电 接线: st_link_v2: NRST GND SWIM 3V3 ↓ ↓ ↓ ↓ 目标板 ...

  3. JavaScript案例:短信验证码倒计时

    展示效果: 代码示例: <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  4. CCF 201903-2 二十四点

    #include <iostream> #include <bits/stdc++.h> #include <string> using namespace std ...

  5. 微信支付模式二java

    这个星期写了下微信支付模式二,在这里进行下整理 微信支付官方文档 1. 需要的配置..具体看下面的链接. https://pay.weixin.qq.com/wiki/doc/api/native.p ...

  6. CamstarVP表格删除行报错

    前提:是从服务中拖出来的表格,带表达式的.但是点击删除按钮的时候,直接页面报错. 原因是:VP上面没有指定服务.

  7. DPU02是一个高度集成的USB转UART的桥接控制器

    DPU02是一个高度集成的USB转UART的桥接控制器,该产品提供了一个简单的解决方案,可将RS-232设计更新为USB设计,并简化PCB组件空间.该DPU02包括了一个USB 2.0全速功能控制器. ...

  8. C# 字符串数组去重(去除数组中重复元素)

    1. 去重distinct()或者GroupBy(p => p).Select(p => p.Key),去重的对象都需要为数组,具体看代码 string itemfileids = &qu ...

  9. vue 中的 .sync 修饰符 与 this.$emit('update:key', value)

    vue 中 .sync 修饰符,是 2.3.0+ 版本新增的功能 在有些情况下,我们可能需要对一个 prop 进行"双向绑定".不幸的是,真正的双向绑定会带来维护上的问题,因为子组 ...

  10. drop table后,约束会被删除吗?

    create table test1(id number); insert into test1 values(11);insert into test1 values(22);insert into ...