Advertisement
Guest User

Untitled

a guest
Apr 25th, 2014
45
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 1.64 KB | None | 0 0
  1. angular.module('positionerDirective', [])
  2. .directive('positioner', function() {
  3. return {
  4. restrict: 'A',
  5. link: function(scope, element){
  6. var top = element[0].offsetTop;
  7. var left = element[0].offsetLeft;
  8. //do whatever math you need here
  9. angular.element(element).addClass(class you need);
  10. }
  11. };
  12. });
  13.  
  14. angular.module('positionerDirective', []).
  15. directive('positioner', function() {
  16. return {
  17. restrict: 'A',
  18. scope: true, // <- create isolated scope
  19. link: function(scope, element) {
  20. var el = element[0];
  21. scope.$watch(function() {
  22. return (el.offsetTop - scope.scrollTop)+':'+(el.offsetLeft - scope.scrollLeft); // <- check element class is to be updated
  23. }, function() {
  24. el.className = 'top-'+(el.offsetTop - scope.scrollTop)+' left-'+(el.offsetLeft - scope.scrollLeft); // <- apply new element class
  25. });
  26. },
  27. controller: ['$scope', '$window', function($scope, $window) {
  28. $scope.updatePosition = function() {
  29. $scope.scrollTop = $window.document.body.scrollTop,
  30. $scope.scrollLeft = $window.document.body.scrollLeft;
  31. if ($scope.$root.$$phase != '$apply' && $scope.$root.$$phase != '$digest') { // <- Avoid call of $apply while digest is already running
  32. $scope.$apply();
  33. }
  34. }
  35. angular.element($window).on('resize scroll', function() { // <- subscribe to DOM events and update scope accordingly
  36. $scope.updatePosition();
  37. });
  38. $scope.updatePosition(); // <- set initial values of $scope.scrollTop and $scope.scrollLeft
  39. }]
  40. };
  41. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement