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-attachment：fixed”规则并使用它。

  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;

降低视差元素的位置

1 个答案: