位置平滑滚动问题：固定；

Question

我正在尝试使用像这样的平滑滚动效果 ： 平滑滚动效果

我已经解决了这个问题position:fixed; （或绝对）是问题的根源。 如果更改此值，它会完美工作，但由于覆盖视口的bg图像而无法解决，因此无法解决。

我该如何解决？ 我发现这个文章 ，我认为铲球的问题，但我似乎无法实现它。

我用来放置背景图片的CSS看起来像这样：

.bg {
  background-repeat:no-repeat;
  background-position:center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  width:100%;
  height:100%;
  position:fixed;
  background-image: url( http://lorempixel.com/400/200/);
}

杰斯菲德尔

Answer 1

就我个人而言，我将在左上角修复div而不将整个页面内容包装在其中。

jsfiddle： https ://jsfiddle.net/jhyvcgv7/1/

.bg {
  background-repeat:no-repeat;
  background-position:center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  width:100%;
  height:100%;
  position:fixed;
  background-image: url( http://lorempixel.com/400/200/);
  top: 0; 
  left: 0;
  z-index: -1;
}