Re: 控制 :target 滚动目标（与行为？）的 CSS 属性（或 JS 方法？）

我觉得合理的方式是这样：http://dabblet.com/gist/70fcabbbb28eabf13143

或者用我注释掉的trick（加个padding再负margin）。

2015-01-12 10:00 GMT+08:00 Kang-Hao（Kenny）Lu（平寿） <
kanghao.lkh@alibaba-inc.com>:

> 我想这事一段时间了，一直没找个空写一下，最近又看了个例子，比如这些官网
> Spark 官网：
>
> http://spark.apache.org/docs/latest/graphx-programming-guide.html

>
> 点一个标题，第一次的时候会跳到 “正确” 的位置，如果点击第二次同样的链接就
> 跳不到了，他用的脚本是
>
> function maybeScrollToHash() {
>   console.log("HERE");
>   if (window.location.hash && $(window.location.hash).length) {
>     console.log("HERE2", $(window.location.hash),
> $(window.location.hash).offset().top);
>     var newTop = $(window.location.hash).offset().top - 57;
>     $(window).scrollTop(newTop);
>   }
> }
>
> 监听的是 hashchange，可想而知。这个脚本太可以吐槽了（57 是写死的），另
> 外，个人认为这个感觉还是比较像是应该用 CSS 解决的，例如：
>
> h2:target {
> scroll-position: under-fixed | above-fixed | auto | <length>
> }
>
> 之类的？当前 [cssom-view] 有个 'scroll-behavior' [1]，看起来像是决定动态
> 效果的，而不是最终位置，另外 [cssom-view] 还给 scrollTo/By 加了个
> ScrollOptions 参数，感觉相当累赘。还没空想一个一体化的想法，先丢出来看看
> 有没有人有类似 Spark 官网的例子。
>
> 'scroll-behavior' 相关讨论如下[2][3][4]。
>
> [1]
>
> http://dev.w3.org/csswg/cssom-view/#smooth-scrolling:-the-%27scroll-behavior%27-property

> [2] http://lists.w3.org/Archives/Public/www-style/2014May/thread#msg255

> [3] http://lists.w3.org/Archives/Public/www-style/2014Oct/thread#msg14

> [4] http://lists.w3.org/Archives/Public/www-style/2014Dec/thread#msg390
>
>
>
> 以上
>
> Kenny
>
>
>
>