我正在尝试实现最初修复并保持在顶部的标题,然后,当达到某个元素或滚动位置时,它将滚出视口,就像它是“正常”内容一样。
到目前为止,我使用Jquery Waypoints插件执行此代码:
$('h1').waypoint(function(direction) {
$(".header-container").slideToggle();
});
只要达到某个元素(在这种情况下为h1
),它就会基本上将标题设置为动画。但我希望用户可以滚动它。
我希望自己明确表示,这很难解释:)
非常感谢任何想法。
答案 0 :(得分:2)
您可以尝试将JQuery Wayppints替换为 JQuery ScrollToFixed 。他们的 Full demo 非常华丽。我认为它完全符合您的要求。
$('.header').scrollToFixed({
preFixed: function() { $(this).find('h1').css('color', 'blue'); },
postFixed: function() { $(this).find('h1').css('color', ''); }
});