How can I hide an element when the page is scrolled? How can I hide an element when the page is scrolled? angularjs angularjs

How can I hide an element when the page is scrolled?


A basic directive would look like this. One key point is you'll need to call scope.$apply() since scroll will run outside of the normal digest cycle.

app = angular.module('myApp', []);app.directive("scroll", function ($window) {    return function(scope, element, attrs) {        angular.element($window).bind("scroll", function() {            scope.visible = false;            scope.$apply();        });    };});

I found this jsfiddle which demonstrates it nicely http://jsfiddle.net/88TzF/