angularjs动态修改css类

时间:2018-04-12 15:44:27

标签: angularjs angularjs-directive angularjs-ng-style

我的目标是使用angular js

动态修改css类值

我的HTML

<body class="loader progress-bar">
</body>

Css课程:

  body {
  margin: 0 auto;
  font-family: 'Source Sans Pro', sans-serif;
  color: #4a4a4a;
  letter-spacing: 1px;
  background: url('#{$imgPath}vsn-bg.png') #f5f5f5 no-repeat 50% 0;
  @media only screen and (max-width: 1024px) { background-position-y: -20px; }

  &.loader {
    > div {
      width: 40px;
      height: 36px;
      background: url('#{$imgPath}/v-360-contact-color@2x.png') center 100%;
      position: absolute;
      top: 50%;
      left: 50%;
      margin: -20px 0 0 -18px;
      z-index: 9999999;
    }
    #{$project}_cc {
      display: none;
    }
  }
  &.progress-bar {
    &::before {
      content: '';
      display: block;
      width: 20%;
      height: 4px;
      background: rgba(245, 245, 245, 0.9);
      transition: width ease .3s;
    }
  }
}

目标是修改进度条 宽度的值,例如动态从20%修改为30%

0 个答案:

没有答案