SlideNavigation

by Alvaro Silvino

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<body ng-app="turingApp" ng-controller="turingController">

  <input ng-model="text" ng-keyup="update()" />

  <div class="one">{{text}}</div>

  <br/>
  <br/>
  <br/>

  <div class="two"></div>

</body>

CSS

.one {
  position: absolute;
  background-color: orange;
  height: 20px;
}

.two {
  background-color: green;
  height: 20px;
  width: 50px;
}

JavaScript

var app = angular.module("turingApp", []);

app.controller("turingController", ["$scope", function($scope) {

  $scope.update = function() {
    var oneWidth = $(".one").width();
    $(".two").width(oneWidth);
  };
}]);