Question

我想制作一个全屏图像（用灯箱展开图片打开），这个图像溢出屏幕大小，用鼠标覆盖窗口的侧面或角落滚动 - ＆gt;例如。当鼠标位于右上角时 - 图像向右滚动，如果它位于右下角 - 向右和向下滚动。

有没有可以实现此目的的jQuery插件？还是HTML5 / CSS3方法？

Answer 1

您可以为图像提供以下样式。

max-width:100%;
max-height:100%;

Answer 2

我找到了这个片段，它就像一个带有一点调整的魅力：

// Variables for current position
var x, y;

function handleMouse(e) {
  // Verify that x and y already have some value
  if (x && y) {
    // Scroll window by difference between current and previous positions
    window.scrollBy(e.clientX - x, e.clientY - y);
  }

  // Store current position
  x = e.clientX;
  y = e.clientY;
}

// Assign handleMouse to mouse movement events
document.onmousemove = handleMouse;

全屏图像滚动鼠标

2 个答案: