Прокрутите div по горизонтали вместо страницы, затем прокрутите страницу

Question

это не дубликат, поскольку я читал другие вопросы, но все предполагают, что прокрутка вертикальная, а мне это нужно для горизонтальной прокрутки. Я пытаюсь прокрутить div, размещенный где-то на странице, когда он достигает центра экрана или почти виден, а затем, когда он заканчивает прокрутку, мне нужно продолжить прокрутку страницы.

На самом деле у меня есть такой «слайдер»: JSFIDDLE

На самом деле, я могу получить совет, когда элемент отображается на странице после прокрутки, но я не знаю как отключить вертикальную прокрутку, прокрутить мой div, а затем снова прокрутить страницу. Важно то, что div прокручивает, сколько я продолжаю прокрутку (предназначено с помощью мыши, клавиатуры и, возможно, прикосновения, это будет потрясающе)

function testInView($el){
var wTop = $(window).scrollTop();
var wBot = wTop + $(window).height();
var eTop = $el.offset().top;
var eBot = eTop + $el.height()+50;
return ((eBot <= wBot) && (eTop >= wTop));
}
function setInView(){
$(".slider-wrapper").each(function(){
    var $zis = $(this);
    $zis.removeClass("inview");
    if(testInView($zis)){
       alert("eccolo");   
    }
});
}
$(document).scroll(function(){
    setInView();
});
$(document).resize(function(){
    setInView();
});
$(document).ready(function(){
    setInView();
});

Answer 1

Если вы хотите отключить вертикальную прокрутку, просто установите overflow-y: hidden для элемента body

body {
    overflow-y: hidden;
}