Изучаем jQuery. Плавающая панель навигации

Довольно распространенным типом реакции веб-страницы на использование прокрутки является плавающая панель навигации. Здесь имеется в виду то, что основной элемент навигации всегда располагается в верхней видимой части экрана независимо от направления прокрутки. Это напоминает навигационное меню, которое следует за взглядом пользователя по мере того, как он прокручивает веб-страницу вниз. Все это можно без труда реализовать при помощи события scroll.
Из книги "Изучаем jQuery. 2-е изд.", стр.90

index.html

...
<div class="navigation"> 
 <ul> 
  <li><a href="#">Про меня</a></li> 
  <li><a href="#">Заметки</a></li> 
  <li><a href="#">Мои Фото</a></li> 
  <li><a href="#">Мои Видео</a></li>
  ... 
 </ul> 
</div>
...

script.js

$(document).ready(function() {
  var $window = $(window),
  $navigation = $(".navigation");

  $window.scroll(function() {
    if (!$navigation.hasClass("fixed") && ($window.scrollTop() > $navigation.offset().top)) {
        $navigation.addClass("fixed").data("top", $navigation.offset().top);
    }
    else if ($navigation.hasClass("fixed") && ($window.scrollTop() < $navigation.data("top"))) {
        $navigation.removeClass("fixed");
    }
  }); 
});