title: AngularJS / ui-bootstrap accordion - scroll to top of active (open) accordion on click
body: <p>When a panel is opened I need to have it scroll back to the ".panel-title" of the one that was just clicked. I know that I can create a directive to do this such as (got this from <a href="https://www.peterbouda.eu/2016/making-an-angular-ui-bootstrap-accordion-scrolling-to-top-when">this site</a>):</p>
  
  <pre><code>.directive( 'scrollTop', scrollTop );
  
    function scrollTop() {
        return {
            restrict: 'A',
            link: link
        };
    }
  
    function link( $scope, element ) {
        $scope.collapsing = false;
        $scope.$watch( function() {
            return $(element).find( '.panel-collapse' ).hasClass( 'collapsing' );
        }, function( status ) {
            if ( $scope.collapsing &amp;&amp; !status ) {
                if ( $(element).hasClass( 'panel-open' ) ) {
                    $( 'html,body' ).animate({
                        scrollTop: $(element).offset().top - 20
                    }, 500 );
                }
            }
            $scope.collapsing = status;
        } );
    }
  </code></pre>
  
  <p>And in the HTML I was supposed to use:</p>
  
  <pre><code>&lt;div uib-accordion-group is-open="status.openPanel" scroll-top&gt;&lt;/div&gt;
  </code></pre>
  
  <p>But this does not seem to work. When you click the second panel it opens the first and second panel and it never even scrolls to the top when opening the third one.</p>
  
  <p>I just need it to scroll back to the ".panel-title" of the panel that was clicked. I think it is pretty ridiculous that this seems to be so difficult to do when a lot of the time the panel content can get pretty long and I think most people would want to scroll to the top of the info when a panel is opened.</p>
  
  <p>I have seen other posts on here but they don't seem to be dealing with AngularJS. I am using " ui-bootstrap-tpls-2.1.3 "</p>
  
  <p><strong>EDIT</strong> - <a href="https://plnkr.co/edit/etdG2OjUi8GxgUywSpvf?p=preview">Here is a Plunker</a> to play with if you would like. </p>
  
  <p>Any help is greatly appreciated.</p>