javascript - 根据媒体查询更改 window.scroll 位置？

Question

我正在处理的网站顶部有一个“强制性”标题，他们不会让我删除。我的解决方法是使用正文 onLoad 事件在该标题下方启动窗口滚动，如下所示：

    <body <?php body_class(); ?> onLoad="window.scroll(0, 100)">

当我在处理站点响应元素时出现了这个问题。当屏幕点击 400px 媒体查询时，我完全隐藏了该 div。这意味着我的网站仍在不必要地向下滚动 100 像素。

有没有办法根据该媒体查询将该 window.scroll 事件更改为不向下滚动，（或者如果他们让我将标题放回移动设备上，则减少向下滚动，尽管更小）？

score 1 · Accepted Answer

你可以玩这个小提琴

JAVASCRIPT：

$(window).load(function () {
    $('html, body').animate({
        scrollTop: $("#content").offset().top
    }, 1000);
});

基本上它会滚动到您要显示的元素，因此如果标题不存在，#content top 将为 0，因此它不会滚动。

或者，您可以使用下面的代码将站点相应地滚动到标题的高度。没有标题 = 没有高度 = 问题解决了。

$(window).load(function () {
    $('html, body').animate({
        scrollTop: $("#header").height()
    }, 1000);
});

1 回答 1