Javascript 仅水平滚动一个div

我需要的是有一个带有背景图像的div和另一个水平滚动的.png图像

我需要背景保持固定，汽车X和Z在向下滚动时水平向右移动（在向上滚动时向后向左移动）。 当汽车看不见时，我希望网站继续垂直滚动到网站的其他内容（以及向上滚动以水平向后滚动div时，使用.png）

html结构如下所示：

<div class="bgimage"> // has a background in css
   <div class="cars">
      <img src="images/cars.png" />
   </div>
</div>
<div class="othercontent">
</div>

//有css背景

但我几乎没有javascript方面的经验，所以我不知道如何实现它

---

（我在谷歌上搜索了parallax，但只找到了完全水平或垂直的网站的示例，这些网站的响应性不强“

如果使用Jquery，可以使用

$（窗口）。在（'scroll'，function（）{}）

上观察滚动事件

我做了一个简单的例子：

var lastScrollTop = 0;
$(window).on('scroll', function(event){
   var st = $(this).scrollTop();
   if (st > lastScrollTop){
       //Scrolling Down
       $('.cars').css('left',st + "px");
   } else {
      //Scrolling Up
      $('.cars').css('left', st + "px");
   }       
});

---

如果使用Jquery，可以使用

$（窗口）.on（'scroll'，function（）{}）

监视滚动事件

我做了一个简单的例子：

var lastScrollTop = 0;
$(window).on('scroll', function(event){
   var st = $(this).scrollTop();
   if (st > lastScrollTop){
       //Scrolling Down
       $('.cars').css('left',st + "px");
   } else {
      //Scrolling Up
      $('.cars').css('left', st + "px");
   }       
});

鼠标滚轮移动

    var mouseWheelEvt = function (event) {
    if (document.body.doScroll)
        document.body.doScroll(event.wheelDelta>0?"left":"right");
    else if ((event.wheelDelta || event.detail) > 0)
        document.body.scrollLeft -= 10;
    else
        document.body.scrollLeft += 10;

    return false;
}
document.body.addEventListener("mousewheel", mouseWheelEvt);

论鼠标滚轮运动

    var mouseWheelEvt = function (event) {
    if (document.body.doScroll)
        document.body.doScroll(event.wheelDelta>0?"left":"right");
    else if ((event.wheelDelta || event.detail) > 0)
        document.body.scrollLeft -= 10;
    else
        document.body.scrollLeft += 10;

    return false;
}
document.body.addEventListener("mousewheel", mouseWheelEvt);

---

听起来像是某种视差，你绑定到滚动事件，并根据用户的滚动在屏幕上移动内容。如果你不知道如何编写javascript，这可能不是最简单的事情，而且这不是一个人们为你编写代码的编码服务？@adeneo抱歉，我不是想让别人为我编写代码，只是如果有人知道怎么写，说明就很少了。我会写javascript，我只是一个新手，所以我不知道我应该做什么：\n我会在路上帮你一点->@adeneo又是我，我来了：这非常适合我需要的，但是如果你不忙，我需要更多的帮助。它在

h中滚动当我将鼠标悬停在某个div上时，它是一个

，但当我将鼠标悬停在

cars或buttons div上时，它不是一个

，有没有办法放置多个div而不是

$（“#home”）呢…

？有没有办法使

按钮和cars div

在

#homeinner

完成滚动后立即相对，除了

如果高度是>***px

，因为我想让布局有响应性？提前谢谢，丹尼斯。听起来像是某种视差，你可以绑定到滚动事件，然后在scr上移动东西甚至基于用户的滚动。如果你不知道如何编写javascript，那么这可能不是最容易做到的事情，而且这不是一个人们为你编写代码的编码服务？@adeneo抱歉，我不是想让别人为我编写代码，如果有人知道如何编写，只需要一些说明。我可以编写javascript，我只是对它不熟悉，所以我不知道我不知道我应该做什么：\n我会在路上帮你一点->@adeneo又是我，好吧，我来了：这对我需要的东西很好，但是如果你不忙的话，我需要更多的帮助。当我悬停它时，它会在

home div

中滚动，但当我悬停

cars或buttons div

时，它不会滚动，是否有办法放置多个div而不是

$（“#home”）…

？是否有办法在

\homeinner

完成滚动后，使

按钮和汽车div

成为相对的，除了

如果高度为>***px

，因为我想让布局具有响应性？提前谢谢，丹尼斯。