如何在输入焦点时向下滚动到 div

Question

任何人都可以帮助我 javascript 在搜索字段获得焦点时使页面向下滚动到搜索框吗？就像你点击搜索栏，位置会改变，直到红色和黄色框看不见。

#overtop {
width: 500px;
height: 100px;
background: red;
}

#top {
width: 500px;
height: 100px;
background: yellow;
}

#searchbox {

}

#content {
width: 500px;
height: 200px;
background: blue;
}

<div id="overtop">
</div>
<div id="top">
</div>
<div id="searchbox">
<input type="text" id="myInput" placeholder="enter.." title="search">
</div>
<div id="content">
</div>

Answer 1

终于明白了。

        $("#myInput").click(function () {
    $("html, body").animate({ scrollTop: $("#searchbox").offset().top }, 300);
    return true;
});

如何在输入焦点时向下滚动到 div

How to scroll down to div when input focused

scroll

focus