滚动到元素后突出显示该元素

时间:2013-04-23 16:36:16

标签: javascript jquery html css

以下是我使用的小提琴:http://jsfiddle.net/fz5Yk/5/

如您所见,它有一页滚动导航。我想在滚动到一个部分时为<strong> </strong>标签中的标题实现突出显示效果(最好使用.animate功能)。只需手动滚动页面,您将在导航菜单中看到突出显示;滚动部分的项目,但我不能完全解析js代码以便将其应用于标题,并且使用.animate函数对其进行干预对我来说似乎要困难得多。你能救我吗?

1 个答案:

答案 0 :(得分:1)

插件页面似乎记录良好; https://github.com/davist11/jQuery-One-Page-Nav

只需在您end:定义中滚动到的位置放置动画;

$('#nav').onePageNav({
    end: function() {
        //I get fired when the animation is ending
    }
});

测试更新

$(window).scroll(function() {
    var visible_start = window.pageYOffset;
    var window_height = window.innerHeight;
    var section3_height = $('#section-3').height();
    var section3_start = $('#section-3')[0].offsetTop;

    if ((visible_start - window_height >= section3_start) &&
       $('#section-3').css('background-color', 'yellow');
    }
});