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

hi all，

昨天会后和kenny又有所讨论，觉得fixed只能使用在页面上只有一个fixed元素的情况，因此又提出一个under(“#banner”)的方式，这里的“#banner”是页面上某元素的ID，且这里只能用ID，因为页面上元素的ID“应该”是唯一的。这么说是因为有些编辑器并不检查元素ID的唯一性。

 

 

Hawkeyes Wind

 

发件人: Xidorn Quan [mailto:quanxunzhen@gmail.com] 
发送时间: 2015年1月22日 11:22
收件人: Kang-Hao（Kenny）Lu（平寿）
抄送: W3C HTML5 中文興趣小組
主题: Re: 答复: target 滚动目标（与行为？）的 CSS 属性（或 JS 方法？）

 

关于你在昨天的会上提出来的

scroll-position: under-fixed | above-fixed | auto | <length>

我觉得 under-fixed 和 above-fixed 可能不太好，因为 fixed 这个用得很广泛，包括在有 sticky 之前的自动固定，还有 Fullscreen 元素和 dialog 一般都是 fixed 的。所以这里以 fixed 作为依据可能带来预期之外的结果。我觉得就一个 <length> 就好了。你给个 auto 让 UA 决定的话，我也不觉得 UA 有什么好的方法能够决定要用什么值……

不过这个东西看过去还是蛮有意义的。

- Xidorn

 

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

(1/12/15, 12:17), Kang-Hao（Kenny）Lu（平寿） wrote:
> (1/12/15, 11:35), Hawkeyes Wind wrote:
>> 我们用的js类似，但是监听的是a标记的onclick事件，并始终return false。
>
> 给个链接吧，多搜集一些实例，我知道有很多，不过多一个链接是一个链接……

我有个相当有说服力的例子，GitHub：

  https://github.com/v8/v8-git-mirror/blob/master/include/v8.h#L243


这个也是 JS 实现的，代码在 github-xxxxxxx.js：

  $(window).scrollTop(s.offset().top - .33 * $(window).height())

所以也有再次输入相同的地址的时候滚动到不一样位置的情形。貌似 GitHub Web
开发不太愿意用这种 Hax 提的那种 CSS hack。


以需求层面来说，这对我还挺重要的，因为我写技术博文喜欢流一些代码链接，简
单的思路当然是留函数名称的那行，读者在点击这些链接之后能滚动到能够滚动到
出现函数名称上面几行的注释感觉起来还是比较理想的。所以大概是：

 :target {
    scroll-position: 33vh;
 }

之类的。

话说回来，GitHub 这里没用 :target。他的一行的背景色貌似是用 JS 设置的，
有搞过代码高亮的知道为什么么？



以上

Kenny