如何在元素高度不够时强制滚动

Question

我有一个div元素（标识为target），其中有几个包含id的锚点。我有一个通过onclick属性连接到javascript函数的按钮，让div元素滚动，以便某个锚点出现在div中的顶部位置。功能是这样的：

scrollToTag = function(id){
    var target = document.getElementById('target');
    var goal = document.getElementById(id);
    target.scrollTop = goal.offsetTop - target.offsetTop;
};

当div（target）的高度不够时，目标锚点不会到达div的顶部，因为它无法进一步滚动。

强制滚动的最佳方法是什么？我提出了一个想法，即在div的高度附加一个空白元素，但是我不确定它是好的。有没有更好的方法呢？

Answer 1

根据您的具体情况，有很多不同的方法，但我会推荐:after pseudo element：

#target:after {
    content: '';
    display: block;
    height: 100%
}

没有额外的标记，它会迫使您在问题中提到底部的间隙。