媒体查询上的响应视差滚动更改背景答案

【问题标题】：Responsive Parallax scrolling change background on media query媒体查询上的响应视差滚动更改背景
【发布时间】：2016-01-21 19:18:32
【问题描述】：

我正在创建一个视差滚动页面。
一切正常，直到我在智能手机上打开页面。

我有媒体查询来更改布局。
这是设置：

<div class="full_width_parallax">
     <div class="wrap_1280">
        <h1 class="intro-tagline">
           Content here
        </h1>
      </div>
 </div>

CSS（桌面版）：

.full_width_parallax{
background:url(images/parallax-background/option-1.jpg) no-repeat center center fixed; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

.wrap_1280{ 
padding: 0 3% 0 3%;
background: #FFF;
opacity: 0.6;
margin: 0 70% 0 3%;
}

CSS（移动版max-width:480px）

.full_width_parallax{
background:url(images/parallax-background/option-2.jpg) no-repeat center center fixed; 
}
.wrap_1280{ 
margin: 0 3% 0 3%;
}

所以移动版的唯一变化是背景图片和边距。如果我在 chrome（桌面）中检查移动版本并运行控制台，它会给我：

所以它应该可以工作，但没有。
有什么想法吗？

【问题讨论】：

标签： html css media-queries parallax

【解决方案1】：

好的。我现在是最笨的...

移动版本的样式表在一个文件夹中。
背景图像的 css 中的链接没有正确的路径...

background:url(images/parallax-background/option-2.jpg) no-repeat center center fixed;

应该是：
background:url(../images/parallax-background/option-3.jpg) no-repeat center center fixed;

【讨论】：