html - 如何将选择选项重新定位到屏幕中间

Question

我之前的问题。

不完全确定如何措辞。如何在 PC 屏幕上更改选择选项的屏幕位置（现在不关心移动或其他屏幕）这个想法是，当您使用该选项时，选择目标将在屏幕下方停止。现在它直接跳到顶部，有效地隐藏在标题下。

这是我目前正在使用的。即使我可以让它像页面下方 40px 一样停止也很棒，而且它最终不会隐藏在标题下。

谢谢一叠。

<h1>The Header Goes Here</h1>
<p id="2007"> FILMS 2007</p>
<p>A bunch of info goes here</p>
<p id="2008"> FILMS 2008</p>
<p>A bunch of info goes here</p>
<p id="2009"> FILMS 2009</p>
<p>A bunch of info goes here that eventually runs off the bottom of the screen</p>


<select onchange="location =this.options[this.selectedIndex].value;">
<option value = #select>Select Year</option>
<option value = #2007>2007</option>
<option value = #2008>2008</option>
<option value = #2009>2009</option>
</select>

我得到了这个回应。

这个问题在这里已经有了答案：

偏移 html 锚以调整固定标题 [重复] (28 个答案)
固定页面标题与页内锚重叠 (36 个答案)

这些是解决重新定位锚标记的出色 CSS 解决方案，但是我看不到这如何解决我的问题。

我尝试了这些答案中提供的各种解决方案，但没有一个有效，当我点击选项时没有任何反应。我删除了 jquery 代码并将其替换为 CSS 选项。没啥事儿。当我将 jquery 替换回来时，选择选项再次起作用，但结果相同。它仍然隐藏在标题后面。

您也许有其他解决方案？

标签： htmljquery