js 移动图片修改图片的top和left，放大图片则以当前视野的图片为中心放大，修改top和left，缩小也同上

在JavaScript中，如果你想要实现这样的效果，通常会结合HTML、CSS以及一些库，比如`transform`属性和事件处理。以下是一个简单的步骤说明：

1. 首先，在HTML中包含图片元素，并添加必要的CSS样式，例如初始大小和位置：

<img id="image" src="your-image-url" style="position:absolute; top:0; left:0;">

2. 使用JavaScript获取图片元素并设置其动态行为：

const imgElement = document.getElementById('image');

// 图片放大缩小函数
function resizeImage(scale) {
    imgElement.style.transform = `scale(${scale}) translate(-50%, -50%)`; // 以图片中心点为中心缩放
    imgElement.style.top = `${imgElement.offsetTop * scale}px`;
    imgElement.style.left = `${imgElement.offsetLeft * scale}px`;
}

// 可能需要监听鼠标滚动事件来调整缩放比例
window.addEventListener('scroll', () => {
    const scrollTop = window.pageYOffset;
    const scrollLeft = window.pageXOffset;

    // 缩放示例，这里假设你想当用户滚动超过一定距离时开始缩放
    if (scrollTop > 100 || scrollLeft > 100) {
        resizeImage(1.1); // 放大10%
    } else {
        resizeImage(1); // 回到原始大小
    }
});

在这个例子中，当你滚动页面时，如果触发了缩放条件，图片就会相对于它自身的位置按比例放大，并保持在屏幕中央。