Javascript 垂直滚动时水平滚动？

我知道这个主题在这里被问了很多，但我找不到最近的任何东西，据我所知，更高版本的jQuery不再支持这些功能

我有一个水平滚动的网站，它工作得很好，但只有当我横向滑动我的触控板而不是垂直滚动时。有人知道最新的方法吗

如果需要，可以提供更多代码。只是想知道是否有人知道解决这个问题的一般方法

下面是我正在寻找的示例（向下滚动前的第一个粉红色部分）：

这是一个基本的设置，我现在有什么，它只会滚动，如果滚动侧而不是垂直和横向。

以下是我迄今为止所尝试的：

以及：

var scroller={}；
scroller.e=document.getElementById（“包装器”）；
if（scroller.e.addEventListener）{
scroller.e.addEventListener（“鼠标滚轮”，鼠标滚轮处理器，错误）；
scroller.e.addEventListener（“DOMMouseScroll”，mouseweelhandler，false）；
}else scroller.e.attachEvent（“onmouseheel”，mouseweelhandler）；
功能MouseWheelHandler（e）{
//交叉浏览器车轮三角
var e=window.event | e；
var delta=-20*（数学最大值（-1，数学最小值（1，（e.wheelDelta | |-e.detail）））；
var pst=$（“#包装器”）.scrollLeft（）+delta；
if（pst<0）{
pst=0；
}else if（pst>$（'.card'）.width（））{
pst=$（'.card'）.width（）；
}
$（“#包装器”）。向左滚动（pst）；
返回false；
};

这是我写的一篇没有烟雾效应的小文章

您可以使用

JQUI

进行平滑滚动等

你想怎么改就怎么改，让我知道你的想法

不：这只是一个使用

mouseweel

尝试垂直滚动的示例

var delta=-1；
var-currentPlayer；
$（“.container”）.bind（“轮子”，函数（e）{
var players=$（this.find（“.player”）；
变量y=e.原始事件.车轮三角洲；
函数setDelta（滚动）{
如果（y>0&&0）
vItem.hide（）.prev（）.show（）；
否则{
///向下或向上滚动到下一节
setDelta（真）；
}
返回false；//禁用滚动
})；

.player{
宽度：100vw；
高度：100vh；
背景：红色；
边框：1px实心#CCC；
溢出：隐藏；
}
.玩家：最后一个{
背景：蓝色；
}
.player>div:not（：第一个孩子）{
显示：无；
}
.player>div{
浮动：左；
宽度：100%；
身高：100%；
颜色：白色；
}
.集装箱{
溢出：隐藏；
}

第1页
第2页
第3页
第1页
第2页
第3页

尝试添加演示版本，以便我们了解您需要的更多内容。更新并添加了链接！您添加的链接实际上与scroll没有太多关系。它仅以播放器的形式显示图像/div。然后显示下一个div，直到最后一个div可见，然后启用向下滚动。是的，它本身是一个插件，但它是唯一的测试我手上有个我知道的例子。我会尝试写一个我刚刚拥有的快速代码笔，希望它会有意义。添加了一个我目前拥有的代码笔。我认为它应该可以很好地工作，但我似乎无法让它在我自己的工作项目中工作。它只是将它翻转回垂直对齐。我会尝试使用它。谢谢你的帮助埃尔普！

var scroller = {};
scroller.e = document.getElementById("wrapper");

if (scroller.e.addEventListener) {
    scroller.e.addEventListener("mousewheel", MouseWheelHandler, false);
    scroller.e.addEventListener("DOMMouseScroll", MouseWheelHandler, false);
} else scroller.e.attachEvent("onmousewheel", MouseWheelHandler);

function MouseWheelHandler(e) {

    // cross-browser wheel delta
    var e = window.event || e;
    var delta = -20 * (Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail))));

    var pst = $('#wrapper').scrollLeft() + delta;

    if (pst < 0) {
        pst = 0;
    } else if (pst > $('.card').width()) {
        pst = $('.card').width();
    }

    $('#wrapper').scrollLeft(pst);

    return false;
};