scrollTo test

var app = angular.module('plunker', ['ngScrollTo']);

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
});

<!DOCTYPE html>
<html>

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link href="style.css" rel="stylesheet" />
    <script data-semver="1.2.16" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.16/angular.min.js" data-require="angular.js@1.2.x"></script>
    <script src="app.js"></script>
    <script src="scrollTo.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    
  </head>

  <body ng-app="plunker" ng-controller="MainCtrl">
    <p>Hello {{name}}!</p>
    
    <p>Top</p>
     <div>
       <a scroll-to="section1">Goto Section 1</a>
     </div>
     <div style="padding-top:1000px">...</div>
     <div id="section1">
      <h2>Section1</h2>
      <a scroll-to="">Back to Top</a>
     </div>
  </body>

</html>

/* Put your css in here */

// Version 0.0.2
// AngularJS simple hash-tag scroll alternative
// this directive uses click event to scroll to the target element
//
// <div ng-app="app">
//   <div ng-controller="myCtrl">
//     <a scroll-to="section1">Section 1</a>
//   </div>
//   ...
//   <div id="section1">
//      <h2>Section1</h2>
//      <a scroll-to="">Back to Top</a>
//   </div>
// </div>
//
//  angular.module('app', ['ngScrollTo']);

angular.module("ngScrollTo",[])
  .directive("scrollTo", ["$window", function($window){
    return {
      restrict : "AC",
      compile : function(){

        var document = $window.document;
        
        function scrollInto(idOrName) {//find element with the give id of name and scroll to the first element it finds
          if(!idOrName)
            $window.scrollTo(0, 0);
          //check if an element can be found with id attribute
          var el = document.getElementById(idOrName);
          if(!el) {//check if an element can be found with name attribute if there is no such id
            el = document.getElementsByName(idOrName);

            if(el && el.length)
              el = el[0];
            else
              el = null;
          }

          if(el){ //if an element is found, scroll to the element
            //el.scrollIntoView();
            
            var top = $(el).offset().top;

            //
            $('html,body').animate({
                scrollTop: (top) + 'px'
            }, 100);
          }
          //otherwise, ignore
        }

        return function(scope, element, attr) {
          element.bind("click", function(event){
            
            setTimeout(function() { 
              scrollInto(attr.scrollTo);
            }, 175);
            
          });
        };
      }
    };
}]);


//angular.module("plunker", ["ngScrollTo"]);