Question

在我的页面上，我有新的评论框，每隔几秒就会叠加在一起。是他们按照我点击的评论框的方式。目前，如果我点击它，当另一个盒子在顶部加载并且必须手动向下滚动它时，该盒子被推离屏幕。我想自动关注我点击的那个框...焦点？

Answer 1

您可以在jQuery中使用scrolltop函数。

//Everytime, you add a comment, scroll the page to the element
$('html, body').animate({
      scrollTop: $("#clickedComment").offset().top
}, 500);

Here's a complete fiddle但你会发现存在逻辑问题。如果您上面有很多评论，则无法向上滚动。

Answer 2

您可以使用锚点：

<div id="aDiv"></div>

然后

 location.href = "#";
 location.href = "#aDiv";

或者您可以使用jquery scrollTop：scrollTop: $(this).offset().top

或者您可以使用javascript scrollTo：window.scrollTo(elementPos,0)

Answer 3

我会实现这两种方式

带有框的观察者模式，它知道何时添加新框，它会检查标记。当焦点放在任何评论框上时，标志本身设置为true;如果没有，则标志为false。

Scrolltop可能会在用户界面中震撼，但也许你可以找到一种方法来制作动画，我不会用勺子喂你。

如果您需要有关设计模式的帮助，请查看Addy Osmanis一书！