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

@hax 这其实也是一种 Hack 的方式，还不够「优雅」。

我觉得可以 用类似 toggle-* 这样的属性扩展：http://www.xanthir.com/b4Kn0



以上
一丝

在 2015年1月14日 下午10:44，John Hax <johnhax@gmail.com>写道：

> 我觉得合理的方式是这样：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
>>
>>
>>
>>
>