transition transform not working

[BechirAhmed]

I found this example on

https://codepen.io/JTParrett/pen/fnCKE

and it’s works fine, i just copied the code to my site but transition doesn’t work

<div class="nav">Scroll to show/hide this bar!</div>

.nav {
  background: #111;
  text-align: center;
  color: #fff;
  padding-top: 20px;
  padding-bottom: 20px;
  position: fixed;
  right: 0px;
  bottom: 0px;
  left: 0px;
  z-index: 1500;
  -webkit-transition: -webkit-transform 1s cubic-bezier(0.86, 0, 0.07, 1);
  -moz-transition: -moz-transform 1s cubic-bezier(0.86, 0, 0.07, 1);
  transition: transform 1s cubic-bezier(0.86, 0, 0.07, 1);
  &.hidden {
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
  }
}

[Shikkediel]

Are you using SASS as well? If not, that’s probably it.

[BechirAhmed]

yes, i use sass

[Shikkediel]

I think we’d need to see more of the code than just the current CSS in that case…

[Author]

Posts