当背景图像正常工作时，平滑滚动和粘性导航栏无法正常工作

Question

如果我使用这些

body {
 background-image: url(/images/background.png) !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  -webkit-background-size: cover !important;
  -moz-background-size: cover !important;
  -o-background-size: cover !important; 
  background-size: cover !important;
  background-color: #464646;
 }

背景非常适合计算机，而平滑滚动适用于计算机和移动设备，尽管应该如此，但是移动设备的背景看起来很奇怪。

相反，如果我使用这些：

   body {
    background-image: url(/images/background.png);
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-attachment: fixed !important;
    -webkit-background-size: cover !important;
    -moz-background-size: cover !important;
    -o-background-size: cover !important; 
    background-size: cover !important;
    background-color: #464646;
   }
  @media only screen and (max-width: 415px){
    body {
      background-size: 100%;
      height: 100vh;
      width: 100%;
    }
  }

背景看起来非常适合移动设备和计算机，但是导航栏和平滑滚动根本不起作用。

什么原因导致了这个问题，我该如何解决？