jQuery透明菜单向上滚动
jQuery Transparent Menu on Scroll Up
我试图实现的目标与此类似:http://www.thoughtspot.com/
我快到了!我无法复制的是,当向上滚动时,导航有一个透明的背景,然后它消失了。
有人能帮我吗?
function hasScrolled() {
var st = $(this).scrollTop();
// Make sure they scroll more than delta
if(Math.abs(lastScrollTop - st) <= delta)
return;
// If they scrolled down and are past the navbar, add class .nav-up.
// This is necessary so you never see what is "behind" the navbar.
if (st > lastScrollTop && st > navbarHeight){
// Scroll Down
$('header').removeClass('nav-down').addClass('nav-up');
} else {
// Scroll Up
if(st + $(window).height() < $(document).height()) {
$('header').removeClass('nav-up').addClass('nav-down');
}
}
lastScrollTop = st;
}
完整的代码请查看我创建的jsfiddle:
http://jsfiddle.net/s6mLJ/2257/
谢谢大家!
这里只需为类添加不透明度,css转换处理其余部分:
opacity: 0
我还添加了一个线性透明背景,使其与您的示例相似。
http://jsfiddle.net/s6mLJ/2262/
新版本http://jsfiddle.net/s6mLJ/2313/
相关文章:
- 如何在 jQuery 中为链接我的“活动”滚动菜单创建例外
- JQuery UI 自动完成在滚动菜单时在文本框中显示 [对象对象]
- Javascript滚动菜单,仅在页面向下的特定方式后开始
- JQuery 一页自动滚动菜单
- 在可滚动菜单外放一个框
- 带有可滚动菜单的下拉菜单.无法修复
- 如何添加背景颜色仅滚动菜单
- "未捕获引用错误:jquery未定义“-向下滚动菜单
- JavaScript滚动菜单
- 单击一页滚动菜单时更改URL哈希值
- 将js数组放入extjs可滚动菜单的最佳方式是什么
- 水平滚动菜单(手动)
- 滚动菜单跟踪问题
- 偏移时隐藏的粘性滚动菜单().底部-500
- Jquery问题--滚动菜单
- 在滚动菜单上更改类,先单击问题
- 使用元素的高度改变页面滚动菜单的CSS
- 使用position: fixed制作滚动菜单
- 重新加载时的可滚动菜单位置
- 使用淡出/淡出与向上滚动菜单