Skip to content

Proposal for specifying scrolling end position

Kang-Hao (Kenny) Lu edited this page Mar 11, 2015 · 5 revisions

Use Case

A Web developer might want to specify the end position of a scroll event, esp. one triggered by clicking cross-referencing links (hash links), as the current browser behavior - the browser scrolls to where the :target element is placed flush with the top of the browser window - disrupts reading.

Applicable Sites and Current Solution

  1. Project documentation (eg. Apache 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 解决的。

  1. GitHub source view

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())

所以也有再次输入相同的地址的时候滚动到不一样位置的情形。

Possible Solution: New Property

  1. Xidorn 的思路 → https://lists.w3.org/Archives/Public/public-html-ig-zh/2015Feb/0003

  2. 原来 Kenny 的思路 → https://lists.w3.org/Archives/Public/public-html-ig-zh/2015Jan/0004

Clone this wiki locally