CSS:使用transform将元素移动到DOM上的特定位置

Question

我有一个图像(svg(，它在加载时从页面的中间开始。当用户向下滚动时，我想让图像向左上漂移，这样它最终就会固定在左上角
我试着使用带滚动号的translate，但我觉得这是一个猜测游戏，关于图像的终点和路径。这是我迄今为止所拥有的。

window.addEventListener('scroll', function(evt) {
let image = document.getElementById('image');
let scrollY = window.pageYOffset;
// how do I use the scrollY to accomplish this? 
image.style.transform = ??

<div style="text-align: center; background: blue; height: 900px;">
<img id="image" style=" margin-top: 200px; " src="mySvg.svg" />
</div>

Answer 1

用于工作文档.getElementById('image'(；需要有相应的元素。

<img id="image" style=" margin-top: 200px; " src="mySvg.svg" />