Jquery 滚动,活动的顶部偏移 class
Jquery scroll, top offset for active class
你能帮我解决一件事吗?
我在网站的顶部菜单中使用了滚动-nav.js - 内部、外部等。http://lukaszradwan.com/www_architect/services.php
现在我使用这段代码设置偏移量
$(window).scroll(function() {
if ($(".navbar").offset().top > 130) {
$(".navbar-fixed-top").addClass("top-nav-collapse");
} else {
$(".navbar-fixed-top").removeClass("top-nav-collapse");
}
});
$(function() {
$('a.page-scroll').bind('click', function(event) {
var $anchor = $(this);
$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top - 130
}, 1500, 'easeInOutExpo');
event.preventDefault();
});
});
但是,例如,当您单击“外部”时,活动 class 在此位置并不准确。
我尝试使用另一个主题的方法,但是我的 "js" 知识很差。 jquery scroll, change navigation active class as the page is scrolling, relative to sections
提前致谢。
现在,仅当部分的顶部偏移量为 0 时才应用活动 class。您可以使用 jquery 将其更改为其他值,如 130。添加此代码:
$(window).scroll(function(){
/* Get id of sections corresponding to top nav menu */
var scroll_sections = []
$('a.page-scroll').each(function(){
scroll_sections.push($(this).attr('href'));
})
for (i in scroll_sections)
{
/* Instead of 0, if the top position offset of section is 130 or less,
we add active class for that section in nav menu */
if ($(scroll_sections[i]).position().top <= $(window).scrollTop() + 130)
{
$('nav li.active').removeClass('active');
$('nav a').eq(i).parent().addClass('active');
}
}
});
你能帮我解决一件事吗?
我在网站的顶部菜单中使用了滚动-nav.js - 内部、外部等。http://lukaszradwan.com/www_architect/services.php
现在我使用这段代码设置偏移量
$(window).scroll(function() {
if ($(".navbar").offset().top > 130) {
$(".navbar-fixed-top").addClass("top-nav-collapse");
} else {
$(".navbar-fixed-top").removeClass("top-nav-collapse");
}
});
$(function() {
$('a.page-scroll').bind('click', function(event) {
var $anchor = $(this);
$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top - 130
}, 1500, 'easeInOutExpo');
event.preventDefault();
});
});
但是,例如,当您单击“外部”时,活动 class 在此位置并不准确。
我尝试使用另一个主题的方法,但是我的 "js" 知识很差。 jquery scroll, change navigation active class as the page is scrolling, relative to sections
提前致谢。
现在,仅当部分的顶部偏移量为 0 时才应用活动 class。您可以使用 jquery 将其更改为其他值,如 130。添加此代码:
$(window).scroll(function(){
/* Get id of sections corresponding to top nav menu */
var scroll_sections = []
$('a.page-scroll').each(function(){
scroll_sections.push($(this).attr('href'));
})
for (i in scroll_sections)
{
/* Instead of 0, if the top position offset of section is 130 or less,
we add active class for that section in nav menu */
if ($(scroll_sections[i]).position().top <= $(window).scrollTop() + 130)
{
$('nav li.active').removeClass('active');
$('nav a').eq(i).parent().addClass('active');
}
}
});