Javascript 将垂直滚动条附加到水平滚动条

我已经尝试做了很多类似的事情，并且尝试了各种各样的方法，包括假滚动条和DOM欺骗代码。似乎没有什么东西像我所需要的那样干净/有效

我试图做的是有一个水平滚动的div（带滚动条），其中嵌套了一个垂直滚动的div。理想情况下，单个水平滚动条会滚动，在某个点之后——垂直滚动旁边的“向上”div

下面是一个示例图，供需要可视化的用户使用： 我想我有一个可行的解决方案：

基本上，我认为水平“场景”可能会有与“向上”div高度相等的溢出。在“场景”的水平宽度通过后…您可以在滚动中，使用（滚动左）和向上使用（滚动顶部）将“向上”容器向右移动

基本上给你的错觉，控制它的垂直滚动与水平滚动条

请在此处查看代码：

我知道如何在“场景”结尾传递函数……目前我正在使用：

$('#main').scroll(function(e)
    {
        if($(this).scrollLeft()>1430)
        {

        }
});

我唯一的问题是，我不太确定如何处理允许我移动上升容器的数学问题。如何将“场景”divs滚动值传递到“向上”的ScrollLeft和ScrollTop值中

有人能给我一些建议吗

谢谢。

您完全偏离了正确的路径，没有垂直滚动条

这是一个很好的站点（显然不是你在30分钟内创建的站点），javascript是模糊的，但是如果你感兴趣的话，你可以用Firebug查看源代码以了解发生了什么

它通过混合

javascript

库、一些很酷的

CSS3 Transform3D

效果和经过仔细研究的

HTML

来提供屏幕向上滚动的效果（实际上，只有图像在移动，而不是滚动，而屏幕始终处于相同的Y位置）

通过将背景中的房子移动得比前面的房子慢，同样的效果也可用于创建深度感知

这种效应称为

一个好的

javascript

库，您可以开始寻找视差效果

您可以看看使用

Stellar.js制作的，尤其是和

希望这个答案能帮你省点时间

祝你学习顺利；）


编辑

这就是你想要的：

打开悬赏奖励答案中的小提琴，按住右箭头键。
如果我是这样一个界面的用户，我肯定会发疯。“让我向下滚动，看看还有什么……”“它突然向右移动了什么？”相反，使用纯垂直布局，比如Twitter。在一个互动性很强的艺术页面（比如我正在制作的页面）上，我已经看到了这一点：这不是一个答案。我知道视差是什么。我以前使用过Stellar.js。我不是想知道如何计算视差，我是想知道是否有任何方法可以将我的水平滚动位置连接到垂直div的.scrollTop和.scrollLeft属性。你知道视差，你知道恒星，你在小提琴上放了一个垂直滚动条？没有任何东西是滚动的，它只是被翻译的。垂直滚动条最终将被隐藏。垂直容器将包含垂直视差元素，而水平容器将包含水平视差元素。链接的站点不是这样做的。检查编辑后的答案