英雄报头

Question

我得到了一个wordpress，我从另一个人那里接过来，看起来顶部的视差部分有一个错误。半差异，它的滚动速度比主页慢一些。我试过摆弄，改变宽度和类似的东西。问题似乎是原始作物太小，但我无法弄清楚我是如何改变原始作物的。

因为当它是全屏时它在滚动时工作得很好，但是如果我将它设置为屏幕的一半，那么当我向下滚动时会有白色空间。所以我认为这是原始作物需要更小，所以当它调整大小时仍然有“更多图像”。（是的，我尝试使用更大的图像，同样的问题）。此帖子中的所有推介图片均可在this url

上找到

查看空白区域的最后一张图片

滚动时，请参阅中间图像以获得所需效果

这是图片的html代码：

<section id="hero-header" data-speed="8" data-type="background" style="background: url("http://playgrounddistribution.com/wp-content/uploads/2017/03/playground-logo-1.jpg"); ?>')  50% 0 no-repeat fixed;">

查看上面imgur链接中的第一张图片（此网址），了解后台脚本。

英雄报头

#hero-header {
    height: 100%; 
    width: 100%; 
    position: relative; 
    -webkit-background-size: cover !important;  
    -moz-background-size: cover !important; 
    -o-background-size: cover !important; 
    background-size: cover !important;
}

一些调整大小的代码，我希望这已经足够了

@media handheld, only screen and (max-width: 769px) {


    #hero-header {
        background-position: center center !important;
        background-attachment: scroll !important;
} 
}

Answer 1

Trick具有dataspeed属性和parallax.js第18行和第37行

Answer 2

好的，所以，因为我似乎没有得到一个我可以使用的答案，这就是我最终做的事情。

基本上我现在没有太多时间在我的手上，所以我选择了一个更临时的解决方案，即在窗口低于1800像素后移除视差，这大致是它开始添加的时间点白色空间。

代码在这里：

@media handheld, only screen and (max-width: 1799px) {
    #hero-header {
        background-position: center center !important;
        background-attachment: scroll !important;
    }
}

在调整大小的窗口中滚动半视差时的空白区域

英雄报头

2 个答案: