Minimize flash of different navbar color
by not having it transition in the first time, but really we need a full fix not a meh mitigation.
This commit is contained in:
parent
b64064604f
commit
cb7f49c103
2 changed files with 10 additions and 5 deletions
|
@ -20,7 +20,9 @@ $(document).ready(function(){
|
||||||
})
|
})
|
||||||
.offset(el.offset().top - headerEl.outerHeight())
|
.offset(el.offset().top - headerEl.outerHeight())
|
||||||
.on("enter",function(e){headerEl.addClass(elClass)})
|
.on("enter",function(e){headerEl.addClass(elClass)})
|
||||||
.on("leave",function(e){headerEl.removeClass(elClass)})
|
// Minimize flash of different navbar color by not having it transition in
|
||||||
|
// the first time, but really we need a full fix not a meh mitigation.
|
||||||
|
.on("leave",function(e){headerEl.removeClass(elClass); headerEl.addClass('navbar-transition')})
|
||||||
.addTo(controller);
|
.addTo(controller);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
@ -30,15 +30,18 @@
|
||||||
.navbar {
|
.navbar {
|
||||||
color: $white;
|
color: $white;
|
||||||
background-color: $dark;
|
background-color: $dark;
|
||||||
|
@include desktop {
|
||||||
|
padding: 1.25em 0;
|
||||||
|
}
|
||||||
|
z-index: +9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navbar-transition {
|
||||||
@include tablet {
|
@include tablet {
|
||||||
transition-property: color, background-color;
|
transition-property: color, background-color;
|
||||||
transition-timing-function: ease-out;
|
transition-timing-function: ease-out;
|
||||||
transition-duration: 500ms;
|
transition-duration: 500ms;
|
||||||
}
|
}
|
||||||
@include desktop {
|
|
||||||
padding: 1.25em 0;
|
|
||||||
}
|
|
||||||
z-index: +9;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Header colors
|
// Header colors
|
||||||
|
|
Loading…
Reference in a new issue