Показать сообщение отдельно
  #1 (permalink)  
Старый 31.07.2014, 15:02
Интересующийся
Отправить личное сообщение для AlertMod Посмотреть профиль Найти все сообщения от AlertMod
 
Регистрация: 18.03.2013
Сообщений: 11

Расчет высоты страницы
Доброго времени суток!
Помогите решить такую проблему.
Есть фиксированная навигация, с 5 элементами.
Так же есть 5 контейнеров на странице, нужно сделать так что бы допустим когда находишься на первой секции к первому элементу в навигации добавлялся класс, когда на втором - второму, и т.д.

есть у меня вот такой код

$(window).scroll(function() {
     if ($(window).scrollTop() <= 900) {
      $('#first').addClass("current");
     }
     else {
      $('#first').removeClass("current");
     }
	 if ($(window).scrollTop() >= 988 && $(window).scrollTop() <= 1899) {
      $('#second').addClass("current");
     }
     else {
      $('#second').removeClass("current");
     }
	 if ($(window).scrollTop() >= 1900 && $(window).scrollTop() <= 2899) {
      $('#third').addClass("current");
     }
     else {
      $('#third').removeClass("current");
     }
	 if ($(window).scrollTop() >= 2900 && $(window).scrollTop() <= 3699) {
      $('#fourth').addClass("current");
     }
     else {
      $('#fourth').removeClass("current");
     }
	 if ($(window).scrollTop() >= 3700) {
      $('#fifth').addClass("current");
     }
     else {
      $('#fifth').removeClass("current");
     }
  });


сделано на скорую руку, знания js у меня не большие.
все конечно работает, но клиент попросил сделать поддержку разрешения высотой в 800 (что бы инфа умещалась на одном экране)

вот тут то самая загвоздка, если через медиа запросы я буду изменять стили, то высота измениться, и мой код будет уже не рабочим,
вопрос в том как сделать чтобы вместо конкретной высоты (прописанной руками) сам скрипт расчитывал высоту каждого контейнера ( те что 5 штук) и сам составлял правильное условие.
Надеюсь на вашу помощь.

Демо
Ответить с цитированием