如何在纯Javascript中为函数添加缓动过渡效果

Question

我有一个特定的页面（窗口内的其他div内的div）用于创建新用户。它是一个带有名字，姓氏......输入字段的表单。我使用了一个EventListener，它在点击时定位输入元素。然后我有一个函数goToPos，它将定义特定页面（div）的顶部以定义绝对位置并滚动到我想要输入元素的位置（顶部 - 80px）。这很完美。

但是，我尝试添加缓动过渡效果，以便在点击不同输入时平滑重新定位（例如CSS通过过渡提供：all .5s ease-in-out;），但我可以＆＃39;似乎弄清楚我如何能够添加这种平滑的过渡效果（并且仅仅是为了这个函数或特定的eventListener，而不是作为一般行为），因为我只能使用纯JavaScript。

请参阅以下代码：

function goToPos(target) {
    document.getElementById('center1').parentElement.scrollTop = 0;
    var rect = target.getBoundingClientRect();
    document.getElementById('center1').parentElement.scrollTop = rect.top - 80;
}

document.addEventListener('click', function(e) {
    e = e || window.event;
    var target = e.target || e.srcElement
    goToPos(target);
}, false);