LOADING...

Preview

Pen ID
Unlock Campus Themeforest adv

 

Code

CSS
#page {
    height: 1000px;
}

header {
    top: 0;
    position: fixed;
    right: 0;
    left: 0;
    z-index: 1030;
    height: 100px;
    background-color: grey;
}

section {
    height: 900px;
    background-color: lightgrey;
}
.min{
   height: 50px;
  -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -o-transition:  all 500ms ease;
    transition: all 500ms ease;
}
.min section {
    background-color: pink;
}
JS
app = angular.module('myApp', []);
app.directive("myNavscroll", function($window) {
    return function(scope, element, attrs) {
        angular.element($window).bind("scroll", function() {
            if (!scope.scrollPosition) {
                scope.scrollPosition = 0
            }

            if (this.pageYOffset > scope.scrollPosition) {
                scope.boolChangeClass = true;
            } else {
                scope.boolChangeClass = false;
            }
            scope.scrollPosition = this.pageYOffset;
            scope.$apply();
        });
    };
});
Host Instantly Drag and Drop Website Builder

 

Description

Change element style in angular js wheather user is scroll up or down. Work in progress
Term
Mon, 11/27/2017 - 21:55

Related Codes

Pen ID
Pen ID
Pen ID