- This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
Viewing 4 posts - 1 through 4 (of 4 total)
- The forum ‘Design’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
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%);
}
}
Are you using SASS as well? If not, that’s probably it.
yes, i use sass
I think we’d need to see more of the code than just the current CSS in that case…