CSS滚动页面，背景图固定

background-attachment: fixed;

**页面中间的版块，顶部固定导航栏110px,滚动到距离顶部110px该位置时，固定背景图**
```
...
<div class="intro-block" id="fixedBg" :class="{'fixed-bg':bgFixed}">
...
</div>
...
```

```
//页面滚动监听
onMounted(() => {
    window.addEventListener('scroll', handleScroll);
})
onUnmounted(() => {
    window.removeEventListener('scroll', handleScroll);

})

function handleScroll() {
    let element = document.getElementById('fixedBg')
    const rect = element.getBoundingClientRect();
    if (rect.top < 110 || rect.top == 110) {
        bgFixed.value = true
    } else {
        bgFixed.value = false
    }
}
```

```
.fixed-bg {
    background-position-y: 110px;
    background-attachment: fixed;
}
```