CODEWITHSUNDEEP
angularjsangularjs-directiveangularjs-ng-style
EL missaoui habib
EL missaoui habib

Reputation: 1075

angularjs dynamically modify css class

My object is to modify css class value dynamically using angular js

My html 

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

Css class :

  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}/[email protected]') 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;
    }
  }
}

the target is to modify the value of progress-bar width for example from 20% to 30% dynamically

Upvotes: 0

Views: 51

Answers (0)

Related Questions