jquery - 降低视差元素的位置

Question

我正在为我朋友的婚礼（http://mhutchinson.me.uk/tom/）建立一个网站，我正在使用视差使白色的“保存日期”文本消失在奶油部分下方，其中包含详细信息.

我的基本功能正常工作，但我无法让“保存日期”图像坐下。它总是与顶部对接，或者如果我将其向下移动，它就无法正常工作。

有谁知道如何定位它？

这是我正在使用的 jQuery：

$(document).ready(function(){
    //.parallax(xPosition, speedFactor, outerHeight) options:
    //xPosition - Horizontal position of the element
    //inertia - speed to move relative to vertical scroll. Example: 0.1 is one tenth the speed of scrolling, 2 is twice the speed of scrolling
    //outerHeight (true/false) - Whether or not jQuery should use it's outerHeight option to determine when a section is in the viewport

    $('#intro').parallax("50%", 0.4);
    $('#logo').parallax("50%", 0.1);
    $('#infoWrapper').parallax("50%", 0.1);
})

Answer 1

在您的 CSS 上尝试删除“背景附件：固定”规则并使用它。

  background-image: url(yourimage.path);
  background-repeat: no-repeat;
  height: 100vh;
  position: absolute;
  background-position: center bottom!important;
  top: 50vh;
  width: 100vw;
  z-index: 200;