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

Question

我在 map 容器中有一个弹出窗口。弹出窗口的位置根据它所附加的标记的位置而变化。应用的 css 是:

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

这里bottom和left的值是通过javascript动态变化的，变化很快。位置变化时popup直接跳转到该位置，不滑动。需要做些什么让它滑动不直接跳到那个位置。

Answer 1

您只需要添加 transition css 属性。

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