Question

我在页面中间有一个带有display.none的元素。我希望当我更改显示以阻止页面滚动到该位置时。这可能吗？

Answer 1

您可以尝试使用ScrollTo方法 - MDN ScrollTo

window.scrollTo(500,0); // (500,0) are the co-ordinates for the ScrollTo method

或者您可以在Jquery ScrollTop

中尝试scrollTop方法

$( "div.demo" ).scrollTop( 300 );

Answer 2

尝试window.scrollTo(x-coord,y-coord )

x-coord is the pixel along the horizontal axis of the document that you want displayed in the upper left.

y-coord is the pixel along the vertical axis of the document that you want displayed in the upper left.

https://developer.mozilla.org/en-US/docs/Web/API/Window.scrollTo

Answer 3

假设您在某些时候使用javascript从＆＃34; display：none＆＃34;更改该元素。到＆＃34;显示：块＆＃34;你可以使用一些javascript同时滚动到那个元素。

编辑：我刚刚快速建立了它，它肯定有效。

说明：atSomePoint只是触发从display：none到display：block的更改的事件。我正在使用.show（）来将这个元素从隐藏变为阻塞，但显然有很多方法可以做到。滚动部分接下来。我们正在采用页面的主体并为其设置动画;去哪儿？好吧，到元素的位置。所以我们使用＆＃39; scrollTop＆＃39;进行动画制作。使用＆＃39; .offset（）。top＆＃39;来设置$（el）从顶部开始。 500就是动画花了多长时间和“摇摆”。是动画类型（缓和），甚至没有必要。此外，如果您对stop（）感到好奇，那么只会停止正在执行的任何其他当前动画。它仍然可以解决这个问题。

(function() {
  $(el).atSomePoint, function() {
    $(this).show();
    $('html, body').stop().animate({
      'scrollTop': $(el).offset().top
    }, 500, 'swing');
  });
});

将页面滚动到显示为块的位置

3 个答案: