如何实现网页滚动侦测以及顶端固定导航栏?

2013-03-13 07:49:16 +08:00
 xuelang
本人不太了解javascript, 但是准备设计一个看着顺眼的网页, 有顶部固定的导航栏和右边目录栏, 其中目录栏实现scrollspy(滚动侦测 http://twitter.github.com/bootstrap/javascript.html#scrollspy ). 在参考了一些网页源码之后设计了一个简单的测试网页, 源码放在jsfiddle上, 示例代码在 http://jsfiddle.net/jFw4G/light/

有以下几个问题:
1.单击右边目录跳转时, 标题所在行被导航栏遮住, 看上去很不美观.
2.滚动侦测时, 不能侦测到二级目录. 好像是还需要一个js脚本.
3.我把html, css, js代码放在本地测试了一下, 但是一级目录也没有滚动侦测效果了.

其中head标签内容为
<head>
<link rel="Stylesheet" type="text/css" href="../style.css">
<title>shell脚本</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-scrollspy.js" type="text/javascript"></script>
<script src="../js/jquery-1.7.1.min.js" type="text/javascript"></script>
</head>
3923 次点击
所在节点    问与答
2 条回复
rudder
2013-06-07 15:12:59 +08:00
js顺序是不是放错了?
<script src="../js/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-scrollspy.js" type="text/javascript"></script>

看这里
http://xiemin.me/bootstrap-2.3.0/javascript.html#scrollspy
xuelang
2013-06-07 16:36:57 +08:00
@rudder 嗯嗯,确实是的,之前segmentfault 上http://segmentfault.com/q/1010000000178043 有人已经指出来了。 不过还是感谢你哈!!!

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/62766

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX