全屏放大图片，悬停滚动

Question

我正在尝试复制这个例子，你可以点击图像，它会放大整个屏幕，然后你可以悬停来上下滚动。

www.uniqlo.com/us/product/women-slim-fit-jeans-143893.html#69|/women/bottoms/jeans/slim-fit/|

不知道从哪里开始，我使用滑块作为基础。

Answer 1

首先，将任务划分为不同的步骤。

• 创建所需的标记。你可以选择一个无序的图像列表。每个列表项都可以包含缩略图和原始图像，以及在初始加载时隐藏的原始图像。
• 将事件侦听器添加到列表中，并在图像被单击时侦听。
• 如果图像被单击，则加载位于屏幕顶部的覆盖以覆盖所有图像。然后绝对定位大图像，并使用更高的z-index
• For滚动将其显示在覆盖图的顶部，您可以使用一些技术。其中一种方法是计算鼠标指针的位置并更改scrollTop值以获得滚动悬停效果。

由于您要求提供开始位置，因此未粘贴任何代码。这应该会让你对需要做什么有个大概的了解。如果你需要代码方面的帮助，请告诉我。

注意-我在一个不让我打开URL的代理后面。我试着想象你想要什么，然后回答了。