如何使用JS/jQuery在页面加载时使滚动DIV获得焦点？

Question

请看这个页面：http://ryan.rawswift.com/sandbox/fixed-bottom-bar/ 当您加载此页面并尝试使用空格键、Page Up/Down键或鼠标滚轮时，页面不会滚动。这是因为页面被包裹在一个次级“视口”中，以便将Facebook栏放置在页面底部。

当您单击页面上的任何位置时，您会给div焦点，然后键盘/鼠标滚轮就可以正常工作了。

有没有办法通过JavaScript或jQuery设置这个焦点，以使键盘/鼠标滚轮正常工作？

谢谢， Ole Marius

- olemarius

---

https://dev59.com/12w15IYBdhLWcg3wO5EH - Seppo Erviälä

你的链接无法使用。 - Andy

Answer 1

你考虑过将该栏设置为固定位置并且取消额外视口吗？

#facebookbar {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 96%;
  padding: .6em 2%;
}

当然，您需要使用文档元素来填充视口：

html, body {
  height: 100%;
}

使用额外的

似乎更像是一种hack，改变标准行为从来都不是一个好主意。

有很多需要考虑和测试的因素(例如使用鼠标滚轮、键盘、触摸滑动等)，如果保持标准，就不需要这些。

- Andy