Javascript 添加类=滚动时处于活动状态
我有一个固定标题和一些部分的单页网站。 我正在使用scrollTo和localScroll跳转到每个部分,但在scroll上添加Javascript 添加类=滚动时处于活动状态,javascript,jquery,html,scrollto,Javascript,Jquery,Html,Scrollto,我有一个固定标题和一些部分的单页网站。 我正在使用scrollTo和localScroll跳转到每个部分,但在scroll上添加class=active到a href时遇到了一个问题 我可以在单击时添加class=active,但我不知道如何在滚动时进行添加,并且在从“旧”部分切换到“新”部分时显然会将其删除 这就是我在单击时所做的: $('#menu').find('a').click(selectNav); function selectNav() { $(this).parents
class=active
到a href
时遇到了一个问题
我可以在单击时添加class=active
,但我不知道如何在滚动时进行添加,并且在从“旧”部分切换到“新”部分时显然会将其删除
这就是我在单击时所做的:
$('#menu').find('a').click(selectNav);
function selectNav() {
$(this).parents('ul:first').find('a').removeClass('active').end().end().addClass('active');
}
function trigger(data) {
var el = $('#menu').find('a[href$="' + data.id + '"]').get(0);
selectNav.call(el);
}
更新:
<ul id="menu">
<li><a href="#homepage"><span>Home</span></a></li>
<li><a href="#connections"><span>Connections</span></a></li>
</ul>
<section id="homepage" class="main">
..........
</section>
<section id="connections" class="main">
..........
</section>
..........
..........
有什么帮助吗?$.fn.inView=function(){
$.fn.inView = function(){
//Window Object
var win = $(window);
//Object to Check
obj = $(this);
//the top Scroll Position in the page
var scrollPosition = win.scrollTop();
//the end of the visible area in the page, starting from the scroll position
var visibleArea = win.scrollTop() + win.height();
//the end of the object to check
var objEndPos = (obj.offset().top + obj.outerHeight());
return(visibleArea >= objEndPos && scrollPosition <= objEndPos ? true : false)
};
$(window).scroll(function(){
if($("#homepage").inView()) {
//#homepage active
} else if($("#connections").inView()) {
//#connections active
}
});
//窗口对象
var win=$(窗口);
//反对检查
obj=$(本);
//页面中的顶部滚动位置
var scrollPosition=win.scrollTop();
//页面中可见区域的末端,从滚动位置开始
var visibleArea=win.scrollTop()+win.height();
//要检查的对象的结尾
var objEndPos=(obj.offset().top+obj.outerHeight());
return(visibleArea>=objEndPos&&scrollPosition如果我读对了您的问题,您希望添加类,然后使窗口滚动到某个位置,然后在滚动完成后删除该类
你可以看看这个问题:
然后我的建议是在单击时应用“Active”类,然后在动画完成后使用回调函数再次删除它
这是我能想到的唯一解决方案,它将在滚动完成后删除该类。请也发布您的标记
$("body").animate(
{
scrollTop:$("#connections").offset().top},0, function(){
console.log("Done - Remove class")}
}
)