如何使视差背景图片的宽度变得敏感

Question

所以我的网站上有一个视差页面，事实证明它是非常静态的。当尺寸是手机的宽度时，它只是在图片的局部放大。我该如何解决？

代码如下：

    <style>
      picture1 {
        background-image = url("link-to-picture1");
      }
      picture2 {
        background-image = url("link-to-picture2");
      }
      .parallax {
         min-height: 700px;
         background-attachment: fixed;
         background-position: center;
         background-repeat: no-repeat;
         background-size: cover;
      }
     #parall{
       color:black;
       font-size: 50px;
       font-family: Knewave;
       text-align: center;
       vertical-align: middle;
       }
   </style>
  <div class="parallax" id = "picture1" ></div>
      <div id = "scrollbox">
          <p id = "parall">Scrollbox-text </p>
       </div>
  <div class = "parallax" id= "picture2"></div>