var img = document.createElement("img"); img.src = src; img.alt = "放大照片"; img.style.maxWidth = "100%"; img.style.maxHeight = "100%"; var scale = 1; // 初始缩放比例 var scaleFactor = 0.1; // 每次滚动的缩放因子 // 鼠标滚轮事件 img.onwheel = function (e) { e.preventDefault(); // 阻止默认滚轮行为处理页面滚动 scale += e.deltaY > 0 ? -scaleFactor : scaleFactor; // 根据滚轮滚动方向确定缩放比例 scale = Math.max(scale, 0.1); // 最小缩放比例为0.1 img.style.transform = `scale(${scale})`; }; // 关闭悬浮窗 popup.onclick = function () { document.body.removeChild(popup); isPopupVisible = false; // 标记悬浮窗为隐藏状态 }; imgContainer.appendChild(img); popup.appendChild(imgContainer); document.body.appendChild(popup); }当我使用滚轮将图片放大后，我需要移动鼠标查看图片上不同的位置

如果你想在放大图片后通过移动鼠标来查图片上不同的位置，你可以在代码中添加一些额外的事件处理程序来实现。以下是一个示例代码段```javascript
var imgContainer = document.createElement("");
imgContainer.className = "image-container";
imgContainer.style.overflow = "hidden";
imgContainer.style.cursor = "move";

var isDragging = false;
var startX, startY, offsetX, offsetY;

// 鼠标按下事件
imgContainer.onmousedown = function (e) {
e.preventDefault();
isDragging = true;
startX = e.clientX;
startY = e.clientY;
offsetX = e.clientX - imgContainer.getBoundingClientRect().left;
offsetY = e.clientY - imgContainer.getBoundingClientRect().top;
};

// 鼠标移动事件
imgContainer.onmousemove = function (e) {
if (isDragging) {
var moveX = e.clientX - startX;
var moveY = e.clientY - startY;

imgContainer.scrollLeft -= moveX;
imgContainer.scrollTop -= moveY;

startX = e.clientX;
startY = e.clientY;
}
};

// 鼠标释放事件
imgContainer.onmouseup = function (e) {
isDragging = false;
};

// 鼠标离开事件
imgContainer.onmouseleave = function (e) {
isDragging = false;
};

// 鼠标滚轮事件
img.onwheel = function (e) {
e.preventDefault();

// ... 上面的代码保持不变 ...

// 重设图片容器的滚动位置
var scrollX = e.clientX - imgContainer.getBoundingClientRect().left;
var scrollY = e.clientY - imgContainer.getBoundingClientRect().top;

imgContainer.scrollLeft = scrollX * scale - offsetX;
imgContainer.scrollTop = scrollY * scale - offsetY;
};

// ... 上面的代码保持不变 ...

在这个示例中，我们为图片容器`imgContainer`添加了鼠标按下、移动、释放和离开事件处理程序。当按下鼠标并移动时，根据鼠标的移动距离来调整图片容器的滚动位置，实现了图片的拖动效果。同时，在滚轮事件中，我们根据缩放比例和鼠标位置来重新计算图片容器的滚动位置，以确保放大后可以正确查看不同位置的图片。

你可以将上述代码与之前提供的代码合并使用，根据需要进行适当调整和修改。记得在CSS中添加`.image-container`的样式定义：

.image-container {
width: 100%;
height: 100%;
position: relative;
}

希望这些代码对你有所帮助！