Question

我正在创建一个非常长的页面，其中间有一个非常宽的SVG图像。我基本上希望页面垂直滚动，直到它到达该图像，然后水平滚动到图像的末尾，并且然后继续垂直滚动到页面底部。

我一直在研究这个问题几个小时都找不到任何东西，所以我真的很感激任何建议。非常感谢你！

Answer 1

好的，这将是我的解决方案：

将页面分为三个部分：

上部容器，SVG和底部容器。

默认情况下，给出底部容器值＆＃34;显示：无＆＃34;。

我将SVG包装到div中，给出包装器值＆＃34; overflow：hidden;

<div class="svg-wrapper" style="display: none;">

    <div class="inner">

        svg or whatever image content goes here...

    </div>

</div>

Div＆＃39; inner＆＃39;我会在那里开始挖掘：http://jqueryui.com/draggable/

然后我会让事件倾听者和内心的事情发生在一起。 x值不是0，我设置上包含＆＃34;显示：无;＆＃34;这样svg包装器及其内容就是唯一可见的对象。

当足够拖动svg时（x值为 - （svg width - 屏幕宽度））我设置底部区域＆＃34;显示：阻止;＆＃34;。

这对你有意义吗？