在具有绝对位置的 div 中实现平滑过渡

Question

我在地图容器中有一个弹出窗口。弹出窗口的位置根据其所附加的标记的位置而变化。应用的CSS是：

#popup{
 opacity:1,
 bottom:100px,
 left:200px
}

这里，bottom 和 left 的值是通过 javascript 动态变化的，而且变化很快。当位置改变时弹窗直接跳转到该位置，不滑动。需要做什么才能让它滑动而不是直接跳到该位置。

Answer 1

您只需要添加transitioncss 属性即可。

#popup{
  opacity:1,
  bottom:100px,
  left:200px
  transition: all ease-in-out 0.5s;
}