JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.angularjs.org/0.10.5/angular-0.10.5.min.js"></script>
<script src="http://flesler-plugins.googlecode.com/files/jquery.scrollTo-1.4.3.1-min.js"></script>
<div ng-app='myapp'>
<div class="performance-zone">
            <div class="navigation">
                <ul>
                    <li class="first active">
                        <a href="#/performance" class="performance" eat-click>Leistungen</a>
                    </li>
                    <li>
                        <a href="#/references" class="references" eat-click>Referenzen</a>
                    </li>
                    <li>
                        <a href="#/about" class="about" eat-click>Über uns</a>
                    </li>
                    <li class="last">
                        <a href="#/contact" class="contact" eat-click>Kontakt</a>
                    </li>
                </ul>
                <div class="clearer"></div>
            </div>  
            <div class="title">
                <h3>Title 1</h3>
            </div>
            <div class="content">
               
            </div>
            <div class="guide">
                <a href="#/references" title="Zu unseren Referenzen" class="references" eat-click>Unsere Referenzen</a>
            </div>
        </div>
        <div class="references-zone">
            <div class="navigation">
                <ul>
                    <li class="first">
                        <a href="#/performance" class="performance" eat-click>Leistungen</a>
                    </li>
                    <li class="active">
                        <a href="#/references" class="references" eat-click>Referenzen</a>
                    </li>
                    <li>
                        <a href="#/about" class="about" eat-click>Über uns</a>
                    </li>
                    <li class="last">
                        <a href="#/contact" class="contact" eat-click>Kontakt</a>
                    </li>
             ...

CSS

.performance-zone{
    height:600px;
}

.references-zone{
    height:600px;
}

.about-zone{
    height:600px;
}

JavaScript

var slidetime = 2000;
var easingmethod = 'easeInOutQuart';

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

app.config(function($routeProvider) {
   $routeProvider.when('/performance', {
        controller: 'PerformanceController',
        template: ' '
   })
   .when('/references', {
        controller: 'ReferencesController',
        template: ' '
   })
   .when('/about', {
        controller: 'AboutController',
        template: ' '
   })
   .otherwise({ 
        controller: 'TopController',
        template: ' '
   });
});

app.controller('PerformanceController', function($scope, $routeParams) {
   $.scrollTo( '.performance-zone', slidetime, {easing:easingmethod, axis: 'y'} );
});

app.controller('ReferencesController', function($scope, $routeParams) {
   $.scrollTo( '.references-zone', slidetime, {easing:easingmethod, axis: 'y'} );
});


app.controller('AboutController', function($scope, $routeParams) {
   $.scrollTo( '.about-zone', slidetime, {easing:easingmethod, axis: 'y'} );
});

app.controller('TopController', function($scope, $routeParams) {
   $.scrollTo( '#logo', slidetime, {easing:easingmethod, axis: 'y'} );
});