Расчет высоты страницы
Доброго времени суток!
Помогите решить такую проблему. Есть фиксированная навигация, с 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 штук) и сам составлял правильное условие. Надеюсь на вашу помощь. Демо |
расходимся пацаны )
лег поспать и придумал это
if ($(window).scrollTop() <= $("#part1").height()) {
|
<script type="text/javascript">
$(window).scroll(function() {
a = $("#part1").height()
b = $("#part2").height()
c = $("#part3").height()
d = $("#part4").height()
e = $("#part5").height()
if ($(window).scrollTop() <= a) {
$('#first').addClass("current");
}
else {
$('#first').removeClass("current");
}
if ($(window).scrollTop() >= a && $(window).scrollTop() <= (a + b) ) {
$('#second').addClass("current");
}
else {
$('#second').removeClass("current");
}
if ($(window).scrollTop() >= (a + b) && $(window).scrollTop() <= (a + b + c) ) {
$('#third').addClass("current");
}
else {
$('#third').removeClass("current");
}
if ($(window).scrollTop() >= (a + b + c) && $(window).scrollTop() <= (a + b + c + d) ) {
$('#fourth').addClass("current");
}
else {
$('#fourth').removeClass("current");
}
if ($(window).scrollTop() >= (a + b + c + d) ) {
$('#fifth').addClass("current");
}
else {
$('#fifth').removeClass("current");
}
});
|
| Часовой пояс GMT +3, время: 01:11. |